@naptics/vue-collection 0.0.7 → 0.1.1

package/components/NSearchbar.d.ts

@@ -12,9 +12,13 @@ export declare const nSearchbarProps: {
      */
     readonly small: BooleanConstructor;
     /**
-     * The classes are directly added to the input (e.g. for shadow).
+     * Adds the classes directly to the input (e.g. for shadow).
      */
     readonly inputClass: StringConstructor;
+    /**
+     * Adds the classes to the top-level element.
+     */
+    readonly addClass: StringConstructor;
     /**
      * This is called when the search-bar receives focus.
      */
@@ -48,9 +52,13 @@ declare const _default: import("vue").DefineComponent<{
      */
     readonly small: BooleanConstructor;
     /**
-     * The classes are directly added to the input (e.g. for shadow).
+     * Adds the classes directly to the input (e.g. for shadow).
      */
     readonly inputClass: StringConstructor;
+    /**
+     * Adds the classes to the top-level element.
+     */
+    readonly addClass: StringConstructor;
     /**
      * This is called when the search-bar receives focus.
      */
@@ -74,9 +82,13 @@ declare const _default: import("vue").DefineComponent<{
      */
     readonly small: BooleanConstructor;
     /**
-     * The classes are directly added to the input (e.g. for shadow).
+     * Adds the classes directly to the input (e.g. for shadow).
      */
     readonly inputClass: StringConstructor;
+    /**
+     * Adds the classes to the top-level element.
+     */
+    readonly addClass: StringConstructor;
     /**
      * This is called when the search-bar receives focus.
      */

package/components/NSearchbar.js

@@ -18,9 +18,13 @@ export const nSearchbarProps = {
    */
   small: Boolean,
   /**
-   * The classes are directly added to the input (e.g. for shadow).
+   * Adds the classes directly to the input (e.g. for shadow).
    */
   inputClass: String,
+  /**
+   * Adds the classes to the top-level element.
+   */
+  addClass: String,
   /**
    * This is called when the search-bar receives focus.
    */
@@ -41,7 +45,9 @@ export default createComponent('NSearchbar', nSearchbarProps, (props, context) =
     }
   };
   context.expose(exposed);
-  return () => _createVNode("div", null, [_createVNode("label", {
+  return () => _createVNode("div", {
+    "class": props.addClass
+  }, [_createVNode("label", {
     "for": "search",
     "class": "sr-only"
   }, [props.placeholder]), _createVNode("div", {

package/components/NSearchbarList.d.ts

@@ -6,12 +6,22 @@ export declare const nSearchbarListProps: {
         readonly type: StringConstructor;
         readonly default: string;
     };
+    /**
+     * Adds the classes directly to the input (e.g. for shadow).
+     */
+    readonly inputClass: StringConstructor;
+    /**
+     * Adds the classes to the top-level element.
+     */
+    readonly addClass: StringConstructor;
     readonly value: import("vue").PropType<string>;
     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 maxItems: {
         readonly type: NumberConstructor;
         readonly default: () => number;
@@ -33,12 +43,22 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: StringConstructor;
         readonly default: string;
     };
+    /**
+     * Adds the classes directly to the input (e.g. for shadow).
+     */
+    readonly inputClass: StringConstructor;
+    /**
+     * Adds the classes to the top-level element.
+     */
+    readonly addClass: StringConstructor;
     readonly value: import("vue").PropType<string>;
     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 maxItems: {
         readonly type: NumberConstructor;
         readonly default: () => number;
@@ -56,12 +76,22 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: StringConstructor;
         readonly default: string;
     };
+    /**
+     * Adds the classes directly to the input (e.g. for shadow).
+     */
+    readonly inputClass: StringConstructor;
+    /**
+     * Adds the classes to the top-level element.
+     */
+    readonly addClass: StringConstructor;
     readonly value: import("vue").PropType<string>;
     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 maxItems: {
         readonly type: NumberConstructor;
         readonly default: () => number;

package/components/NSearchbarList.js

@@ -10,7 +10,15 @@ export const nSearchbarListProps = {
   /**
    * @see {@link nSearchbarProps.placeholder}
    */
-  placeholder: nSearchbarProps.placeholder
+  placeholder: nSearchbarProps.placeholder,
+  /**
+   * Adds the classes directly to the input (e.g. for shadow).
+   */
+  inputClass: String,
+  /**
+   * Adds the classes to the top-level element.
+   */
+  addClass: String
 };
 /**
  * The `NSearchbarList` is a {@link NSearchbar} with a {@link NSuggestionList}.
@@ -27,7 +35,8 @@ export default createComponent('NSearchbarList', nSearchbarListProps, props => {
       "value": props.value,
       "onUpdateValue": props.onUpdateValue,
       "placeholder": props.placeholder,
-      "inputClass": "shadow-lg",
+      "inputClass": `shadow-lg ${props.inputClass}`,
+      "addClass": props.addClass,
       "onFocus": onFocus,
       "onBlur": onBlur
     }, null),

package/components/NSelect.d.ts

@@ -3,7 +3,7 @@ import { type PropType } from 'vue';
 import { type NValInputExposed } from './NValInput';
 export declare const nSelectProps: {
     readonly tooltipText: StringConstructor;
-    readonly tooltipContent: PropType<() => void>;
+    readonly tooltipContent: PropType<() => JSX.Element>;
     readonly tooltipHide: BooleanConstructor;
     readonly tooltipShow: BooleanConstructor;
     readonly tooltipPlacement: {
@@ -14,6 +14,8 @@ export declare const nSelectProps: {
         readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
         readonly default: "max-w-xs";
     };
+    readonly tooltipWrapperAddClass: StringConstructor;
+    readonly tooltipContentAddClass: StringConstructor;
     /**
      * The id of the currently selected option of this input.
      */
@@ -47,6 +49,14 @@ export declare const nSelectProps: {
      * @see {@link nValInputProps.form}
      */
     readonly form: PropType<import("./ValidatedForm").ValidatedForm>;
+    /**
+     * @see {@link nValInputProps.inputClass}
+     */
+    readonly inputClass: StringConstructor;
+    /**
+     * @see {@link nValInputProps.addClass}
+     */
+    readonly addClass: StringConstructor;
 };
 export type SelectionOption = Identifiable & {
     label: string;
@@ -57,7 +67,7 @@ export type NSelectExposed = NValInputExposed;
  */
 declare const _default: import("vue").DefineComponent<{
     readonly tooltipText: StringConstructor;
-    readonly tooltipContent: PropType<() => void>;
+    readonly tooltipContent: PropType<() => JSX.Element>;
     readonly tooltipHide: BooleanConstructor;
     readonly tooltipShow: BooleanConstructor;
     readonly tooltipPlacement: {
@@ -68,6 +78,8 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
         readonly default: "max-w-xs";
     };
+    readonly tooltipWrapperAddClass: StringConstructor;
+    readonly tooltipContentAddClass: StringConstructor;
     /**
      * The id of the currently selected option of this input.
      */
@@ -101,9 +113,17 @@ declare const _default: import("vue").DefineComponent<{
      * @see {@link nValInputProps.form}
      */
     readonly form: PropType<import("./ValidatedForm").ValidatedForm>;
+    /**
+     * @see {@link nValInputProps.inputClass}
+     */
+    readonly inputClass: StringConstructor;
+    /**
+     * @see {@link nValInputProps.addClass}
+     */
+    readonly addClass: StringConstructor;
 }, import("vue").RenderFunction, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, never[], never, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     readonly tooltipText: StringConstructor;
-    readonly tooltipContent: PropType<() => void>;
+    readonly tooltipContent: PropType<() => JSX.Element>;
     readonly tooltipHide: BooleanConstructor;
     readonly tooltipShow: BooleanConstructor;
     readonly tooltipPlacement: {
@@ -114,6 +134,8 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
         readonly default: "max-w-xs";
     };
+    readonly tooltipWrapperAddClass: StringConstructor;
+    readonly tooltipContentAddClass: StringConstructor;
     /**
      * The id of the currently selected option of this input.
      */
@@ -147,6 +169,14 @@ declare const _default: import("vue").DefineComponent<{
      * @see {@link nValInputProps.form}
      */
     readonly form: PropType<import("./ValidatedForm").ValidatedForm>;
+    /**
+     * @see {@link nValInputProps.inputClass}
+     */
+    readonly inputClass: StringConstructor;
+    /**
+     * @see {@link nValInputProps.addClass}
+     */
+    readonly addClass: StringConstructor;
 }>> & {}, {
     readonly tooltipHide: boolean;
     readonly tooltipShow: boolean;

package/components/NSelect.js

@@ -38,6 +38,14 @@ export const nSelectProps = {
    * @see {@link nValInputProps.form}
    */
   form: nValInputProps.form,
+  /**
+   * @see {@link nValInputProps.inputClass}
+   */
+  inputClass: nValInputProps.inputClass,
+  /**
+   * @see {@link nValInputProps.addClass}
+   */
+  addClass: nValInputProps.addClass,
   ...nToolTipPropsForImplementor
 };
 /**
@@ -69,7 +77,7 @@ export default createComponent('NSelect', nSelectProps, (props, context) => {
         "value": props.value,
         "onChange": event => slotProps.onUpdateValue(event.target.value),
         "onBlur": slotProps.onBlur,
-        "class": ['block w-full py-2 pl-4 pr-10 rounded-md border focus:outline-none focus:ring-1', props.disabled ? 'text-default-300 ' : 'text-default-900 ', slotProps.error ? 'border-red-500 focus:border-red-500 focus:ring-red-500' : 'border-default-300 focus:border-primary-500 focus:ring-primary-500']
+        "class": ['block w-full py-2 pl-4 pr-10 rounded-md border focus:outline-none focus:ring-1', props.disabled ? 'text-default-300 ' : 'text-default-900 ', slotProps.error ? 'border-red-500 focus:border-red-500 focus:ring-red-500' : 'border-default-300 focus:border-primary-500 focus:ring-primary-500', props.inputClass]
       }, [_createVNode("option", {
         "disabled": !props.optional,
         "selected": !props.value,

package/components/NTable.d.ts

@@ -86,6 +86,10 @@ export declare const nTableProps: {
         readonly type: PropType<TableRow[]>;
         readonly default: () => never[];
     };
+    /**
+     * Adds the classes to the top-level element.
+     */
+    readonly addClass: StringConstructor;
 };
 /**
  * The `NTable` is a styled html table which accepts data and displays it appropriately.
@@ -135,6 +139,10 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: PropType<TableRow[]>;
         readonly default: () => never[];
     };
+    /**
+     * Adds the classes to the top-level element.
+     */
+    readonly addClass: StringConstructor;
 }, import("vue").RenderFunction, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, never[], never, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     /**
      * The headings of the table. These define which columns are shown in the table and in which order.
@@ -180,6 +188,10 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: PropType<TableRow[]>;
         readonly default: () => never[];
     };
+    /**
+     * Adds the classes to the top-level element.
+     */
+    readonly addClass: StringConstructor;
 }>> & {}, {
     readonly details: TableDetail[];
     readonly items: TableRow[];

package/components/NTable.js

@@ -50,7 +50,11 @@ export const nTableProps = {
   items: {
     type: Array,
     default: () => []
-  }
+  },
+  /**
+   * Adds the classes to the top-level element.
+   */
+  addClass: String
 };
 /**
  * The `NTable` is a styled html table which accepts data and displays it appropriately.
@@ -86,7 +90,7 @@ export default createComponent('NTable', nTableProps, props => {
     immediate: true
   });
   return () => _createVNode("div", {
-    "class": "overflow-x-auto"
+    "class": `overflow-x-auto ${props.addClass}`
   }, [_createVNode("table", {
     "class": "min-w-full text-default-500 text-sm"
   }, [_createVNode("thead", {

package/components/NTableAction.d.ts

@@ -16,6 +16,10 @@ export declare const nTableActionProps: {
         readonly type: PropType<"button" | "submit" | "reset">;
         readonly default: "button";
     };
+    /**
+     * Adds the classes to the top-level element.
+     */
+    readonly addClass: StringConstructor;
     /**
      * This is called when the action is clicked.
      * It is only called when the `route` prop is not set on the action.
@@ -42,6 +46,10 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: PropType<"button" | "submit" | "reset">;
         readonly default: "button";
     };
+    /**
+     * Adds the classes to the top-level element.
+     */
+    readonly addClass: StringConstructor;
     /**
      * This is called when the action is clicked.
      * It is only called when the `route` prop is not set on the action.
@@ -63,6 +71,10 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: PropType<"button" | "submit" | "reset">;
         readonly default: "button";
     };
+    /**
+     * Adds the classes to the top-level element.
+     */
+    readonly addClass: StringConstructor;
     /**
      * This is called when the action is clicked.
      * It is only called when the `route` prop is not set on the action.

package/components/NTableAction.js

@@ -18,6 +18,10 @@ export const nTableActionProps = {
    * The html attribute, which indicates the type of the button.
    */
   type: nButtonProps.type,
+  /**
+   * Adds the classes to the top-level element.
+   */
+  addClass: String,
   /**
    * This is called when the action is clicked.
    * It is only called when the `route` prop is not set on the action.
@@ -32,7 +36,7 @@ export default createComponent('NTableAction', nTableActionProps, (props, {
   slots
 }) => {
   const content = () => slots.default?.() || _createVNode(_Fragment, null, [props.text]);
-  const classes = 'text-left font-medium focus:outline-none focus-visible:ring-2 focus-visible:ring-default-900 rounded-sm ring-offset-2 text-default-900 hover:underline hover:text-default-700';
+  const classes = ['text-left font-medium focus:outline-none focus-visible:ring-2 focus-visible:ring-default-900 rounded-sm ring-offset-2 text-default-900 hover:underline hover:text-default-700', props.addClass];
   return () => {
     let _slot;
     return props.route ? _createVNode(RouterLink, {

package/components/NTextArea.d.ts

@@ -11,7 +11,7 @@ export declare const nTextAreaProps: {
     readonly hideErrorMessage: BooleanConstructor;
     readonly disableBlurValidation: BooleanConstructor;
     readonly tooltipText: StringConstructor;
-    readonly tooltipContent: PropType<() => void>;
+    readonly tooltipContent: PropType<() => JSX.Element>;
     readonly tooltipHide: BooleanConstructor;
     readonly tooltipShow: BooleanConstructor;
     readonly tooltipPlacement: {
@@ -19,11 +19,11 @@ export declare const nTextAreaProps: {
         readonly default: "auto";
     };
     readonly tooltipMaxWidth: {
-        readonly type: PropType<import("../utils/tailwind").TWMaxWidth>; /**
-         * If set to `true` the text area is displayed with a red border.
-         */
+        readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
         readonly default: "max-w-xs";
     };
+    readonly tooltipWrapperAddClass: StringConstructor;
+    readonly tooltipContentAddClass: StringConstructor;
     /**
      * The name of the text area. Is displayed as a label above the text area.
      */
@@ -65,6 +65,14 @@ export declare const nTextAreaProps: {
      * If set to `true` the text area's label is hidden.
      */
     readonly hideLabel: BooleanConstructor;
+    /**
+     * Adds the classes directly to the input (e.g. for shadow).
+     */
+    readonly inputClass: StringConstructor;
+    /**
+     * Adds the classes to the top-level element.
+     */
+    readonly addClass: StringConstructor;
     /**
      * This is called when the text area reveices focus.
      */
@@ -94,7 +102,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly hideErrorMessage: BooleanConstructor;
     readonly disableBlurValidation: BooleanConstructor;
     readonly tooltipText: StringConstructor;
-    readonly tooltipContent: PropType<() => void>;
+    readonly tooltipContent: PropType<() => JSX.Element>;
     readonly tooltipHide: BooleanConstructor;
     readonly tooltipShow: BooleanConstructor;
     readonly tooltipPlacement: {
@@ -102,11 +110,11 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: "auto";
     };
     readonly tooltipMaxWidth: {
-        readonly type: PropType<import("../utils/tailwind").TWMaxWidth>; /**
-         * If set to `true` the text area is displayed with a red border.
-         */
+        readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
         readonly default: "max-w-xs";
     };
+    readonly tooltipWrapperAddClass: StringConstructor;
+    readonly tooltipContentAddClass: StringConstructor;
     /**
      * The name of the text area. Is displayed as a label above the text area.
      */
@@ -148,6 +156,14 @@ declare const _default: import("vue").DefineComponent<{
      * If set to `true` the text area's label is hidden.
      */
     readonly hideLabel: BooleanConstructor;
+    /**
+     * Adds the classes directly to the input (e.g. for shadow).
+     */
+    readonly inputClass: StringConstructor;
+    /**
+     * Adds the classes to the top-level element.
+     */
+    readonly addClass: StringConstructor;
     /**
      * This is called when the text area reveices focus.
      */
@@ -170,7 +186,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly hideErrorMessage: BooleanConstructor;
     readonly disableBlurValidation: BooleanConstructor;
     readonly tooltipText: StringConstructor;
-    readonly tooltipContent: PropType<() => void>;
+    readonly tooltipContent: PropType<() => JSX.Element>;
     readonly tooltipHide: BooleanConstructor;
     readonly tooltipShow: BooleanConstructor;
     readonly tooltipPlacement: {
@@ -178,11 +194,11 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: "auto";
     };
     readonly tooltipMaxWidth: {
-        readonly type: PropType<import("../utils/tailwind").TWMaxWidth>; /**
-         * If set to `true` the text area is displayed with a red border.
-         */
+        readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
         readonly default: "max-w-xs";
     };
+    readonly tooltipWrapperAddClass: StringConstructor;
+    readonly tooltipContentAddClass: StringConstructor;
     /**
      * The name of the text area. Is displayed as a label above the text area.
      */
@@ -224,6 +240,14 @@ declare const _default: import("vue").DefineComponent<{
      * If set to `true` the text area's label is hidden.
      */
     readonly hideLabel: BooleanConstructor;
+    /**
+     * Adds the classes directly to the input (e.g. for shadow).
+     */
+    readonly inputClass: StringConstructor;
+    /**
+     * Adds the classes to the top-level element.
+     */
+    readonly addClass: StringConstructor;
     /**
      * This is called when the text area reveices focus.
      */

package/components/NTextArea.js

@@ -52,6 +52,14 @@ const nTextAreaBaseProps = {
    * If set to `true` the text area's label is hidden.
    */
   hideLabel: Boolean,
+  /**
+   * Adds the classes directly to the input (e.g. for shadow).
+   */
+  inputClass: String,
+  /**
+   * Adds the classes to the top-level element.
+   */
+  addClass: String,
   /**
    * This is called when the text area reveices focus.
    */
@@ -117,7 +125,7 @@ const NTextAreaBase = createComponent('NTextAreaBase', nTextAreaBaseProps, (prop
       "onFocus": () => props.onFocus?.(),
       "onBlur": () => props.onBlur?.(),
       "onInvalid": event => event.preventDefault(),
-      "class": ['block w-full rounded-md border focus:outline-none focus:ring-1 ', 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.resizable ? 'resize-y' : 'resize-none']
+      "class": ['block w-full rounded-md border focus:outline-none focus:ring-1 ', 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.resizable ? 'resize-y' : 'resize-none', props.inputClass]
     }, null), _withDirectives(_createVNode("div", {
       "class": "absolute inset-y-0 right-0 pr-3 flex items-center pointer-events-none"
     }, [_createVNode(ExclamationCircleIcon, {

package/components/NTooltip.d.ts

@@ -10,7 +10,7 @@ export declare const nTooltipProps: {
     /**
      * A slot to replace the content of the tooltip. This will override the `text` prop.
      */
-    readonly content: PropType<() => void>;
+    readonly content: PropType<() => JSX.Element>;
     /**
      * If set to `true` the tooltip is shown constantly.
      */
@@ -38,6 +38,14 @@ export declare const nTooltipProps: {
         readonly type: PropType<TWMaxWidth>;
         readonly default: "max-w-xs";
     };
+    /**
+     * Adds the classes to the (invisible) wrapper element.
+     */
+    readonly wrapperAddClass: StringConstructor;
+    /**
+     * Adds the classes to the container of the tooltips content.
+     */
+    readonly contentAddClass: StringConstructor;
 };
 /**
  * These props are made to use on a component which implements the tooltip
@@ -56,7 +64,7 @@ export declare const nToolTipPropsForImplementor: {
      * If the slot is set, the tooltip with the specified content is added to the component.
      * @see {@link nTooltipProps.content}
      */
-    tooltipContent: PropType<() => void>;
+    tooltipContent: PropType<() => JSX.Element>;
     /**
      * @see {@link nTooltipProps.hide}
      */
@@ -79,6 +87,14 @@ export declare const nToolTipPropsForImplementor: {
         readonly type: PropType<TWMaxWidth>;
         readonly default: "max-w-xs";
     };
+    /**
+     * @see {@link nTooltipProps.wrapperAddClass}
+     */
+    tooltipWrapperAddClass: StringConstructor;
+    /**
+     * @see {@link nTooltipProps.contentAddClass}
+     */
+    tooltipContentAddClass: StringConstructor;
 };
 /**
  * Maps the {@link nToolTipPropsForImplementor} props to normal tooltip props
@@ -86,11 +102,13 @@ export declare const nToolTipPropsForImplementor: {
  */
 export declare function mapTooltipProps(props: ExtractedProps<typeof nToolTipPropsForImplementor>): {
     text: string | undefined;
-    content: (() => void) | undefined;
+    content: (() => JSX.Element) | undefined;
     hide: boolean;
     show: boolean;
     placement: TooltipPlacement;
     maxWidth: TWMaxWidth;
+    wrapperAddClass: string | undefined;
+    contentAddClass: string | undefined;
 };
 /**
  * The `NTooltip` is a wrapper for any component which adds a tooltip to it.
@@ -111,7 +129,7 @@ declare const _default: import("vue").DefineComponent<{
     /**
      * A slot to replace the content of the tooltip. This will override the `text` prop.
      */
-    readonly content: PropType<() => void>;
+    readonly content: PropType<() => JSX.Element>;
     /**
      * If set to `true` the tooltip is shown constantly.
      */
@@ -139,6 +157,14 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: PropType<TWMaxWidth>;
         readonly default: "max-w-xs";
     };
+    /**
+     * Adds the classes to the (invisible) wrapper element.
+     */
+    readonly wrapperAddClass: StringConstructor;
+    /**
+     * Adds the classes to the container of the tooltips content.
+     */
+    readonly contentAddClass: StringConstructor;
 }, import("vue").RenderFunction, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, never[], never, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     /**
      * The text content of the tooltip.
@@ -147,7 +173,7 @@ declare const _default: import("vue").DefineComponent<{
     /**
      * A slot to replace the content of the tooltip. This will override the `text` prop.
      */
-    readonly content: PropType<() => void>;
+    readonly content: PropType<() => JSX.Element>;
     /**
      * If set to `true` the tooltip is shown constantly.
      */
@@ -175,6 +201,14 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: PropType<TWMaxWidth>;
         readonly default: "max-w-xs";
     };
+    /**
+     * Adds the classes to the (invisible) wrapper element.
+     */
+    readonly wrapperAddClass: StringConstructor;
+    /**
+     * Adds the classes to the container of the tooltips content.
+     */
+    readonly contentAddClass: StringConstructor;
 }>> & {}, {
     readonly show: boolean;
     readonly hide: boolean;