Fixed #5175 - InputIcon component added
parent
bd4d56ef4c
commit
f8a3167618
|
@ -0,0 +1,15 @@
|
||||||
|
<script>
|
||||||
|
import BaseComponent from 'primevue/basecomponent';
|
||||||
|
import InputIconStyle from 'primevue/inputicon/style';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'BaseInputIcon',
|
||||||
|
extends: BaseComponent,
|
||||||
|
style: InputIconStyle,
|
||||||
|
provide() {
|
||||||
|
return {
|
||||||
|
$parentInstance: this
|
||||||
|
};
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
|
@ -0,0 +1,117 @@
|
||||||
|
/**
|
||||||
|
*
|
||||||
|
* InputIcon displays text, icon, buttons and other content can be grouped next to an input.
|
||||||
|
*
|
||||||
|
* [Live Demo](https://www.primevue.org/inputgroup/)
|
||||||
|
*
|
||||||
|
* @module inputicon
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
import { VNode } from 'vue';
|
||||||
|
import { ComponentHooks } from '../basecomponent';
|
||||||
|
import { PassThroughOptions } from '../passthrough';
|
||||||
|
import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
|
||||||
|
|
||||||
|
export declare type InputIconPassThroughOptionType = InputIconPassThroughAttributes | ((options: InputIconPassThroughMethodOptions) => InputIconPassThroughAttributes | string) | string | null | undefined;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Custom passthrough(pt) option method.
|
||||||
|
*/
|
||||||
|
export interface InputIconPassThroughMethodOptions {
|
||||||
|
/**
|
||||||
|
* Defines instance.
|
||||||
|
*/
|
||||||
|
instance: any;
|
||||||
|
/**
|
||||||
|
* Defines valid attributes.
|
||||||
|
*/
|
||||||
|
attrs: any;
|
||||||
|
/**
|
||||||
|
* Defines parent options.
|
||||||
|
*/
|
||||||
|
parent: any;
|
||||||
|
/**
|
||||||
|
* Defines passthrough(pt) options in global config.
|
||||||
|
*/
|
||||||
|
global: object | undefined;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Custom passthrough(pt) options.
|
||||||
|
* @see {@link InputIconProps.pt}
|
||||||
|
*/
|
||||||
|
export interface InputIconPassThroughOptions {
|
||||||
|
/**
|
||||||
|
* Used to pass attributes to the root's DOM element.
|
||||||
|
*/
|
||||||
|
root?: InputIconPassThroughOptionType;
|
||||||
|
/**
|
||||||
|
* Used to manage all lifecycle hooks.
|
||||||
|
* @see {@link BaseComponent.ComponentHooks}
|
||||||
|
*/
|
||||||
|
hooks?: ComponentHooks;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Custom passthrough attributes for each DOM elements
|
||||||
|
*/
|
||||||
|
export interface InputIconPassThroughAttributes {
|
||||||
|
[key: string]: any;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Defines valid properties in InputIcon component.
|
||||||
|
*/
|
||||||
|
export interface InputIconProps {
|
||||||
|
/**
|
||||||
|
* Used to pass attributes to DOM elements inside the component.
|
||||||
|
* @type {InputIconPassThroughOptions}
|
||||||
|
*/
|
||||||
|
pt?: PassThrough<InputIconPassThroughOptions>;
|
||||||
|
/**
|
||||||
|
* Used to configure passthrough(pt) options of the component.
|
||||||
|
* @type {PassThroughOptions}
|
||||||
|
*/
|
||||||
|
ptOptions?: PassThroughOptions;
|
||||||
|
/**
|
||||||
|
* When enabled, it removes component related styles in the core.
|
||||||
|
* @defaultValue false
|
||||||
|
*/
|
||||||
|
unstyled?: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Defines valid slots in InputIcon component.
|
||||||
|
*/
|
||||||
|
export interface InputIconSlots {
|
||||||
|
/**
|
||||||
|
* Custom default template.
|
||||||
|
*/
|
||||||
|
default(): VNode[];
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Defines valid emits in InputIcon component.
|
||||||
|
*/
|
||||||
|
export interface InputIconEmits {}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* **PrimeVue - InputIcon**
|
||||||
|
*
|
||||||
|
* _InputIcon displays text, icon, buttons and other content can be grouped next to an input._
|
||||||
|
*
|
||||||
|
* [Live Demo](https://www.primevue.org/inputtext/)
|
||||||
|
* --- ---
|
||||||
|
* ![PrimeVue](https://primefaces.org/cdn/primevue/images/logo-100.png)
|
||||||
|
*
|
||||||
|
* @group Component
|
||||||
|
*/
|
||||||
|
declare class InputIcon extends ClassComponent<InputIconProps, InputIconSlots, InputIconEmits> {}
|
||||||
|
|
||||||
|
declare module '@vue/runtime-core' {
|
||||||
|
interface GlobalComponents {
|
||||||
|
InputIcon: GlobalComponentConstructor<InputIcon>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default InputIcon;
|
|
@ -0,0 +1,12 @@
|
||||||
|
<template>
|
||||||
|
<slot />
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import BaseInputIcon from './BaseInputIcon.vue';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'InputIcon',
|
||||||
|
extends: BaseInputIcon
|
||||||
|
};
|
||||||
|
</script>
|
|
@ -0,0 +1,9 @@
|
||||||
|
{
|
||||||
|
"main": "./inputicon.cjs.js",
|
||||||
|
"module": "./inputicon.esm.js",
|
||||||
|
"unpkg": "./inputicon.min.js",
|
||||||
|
"types": "./InputIcon.d.ts",
|
||||||
|
"browser": {
|
||||||
|
"./sfc": "./InputIcon.vue"
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1 @@
|
||||||
|
export default {};
|
|
@ -0,0 +1,3 @@
|
||||||
|
import { BaseStyle } from '../../base/style';
|
||||||
|
|
||||||
|
export interface InputIconStyle extends BaseStyle {}
|
|
@ -0,0 +1,6 @@
|
||||||
|
{
|
||||||
|
"main": "./inputiconstyle.cjs.js",
|
||||||
|
"module": "./inputiconstyle.esm.js",
|
||||||
|
"unpkg": "./inputiconstyle.min.js",
|
||||||
|
"types": "./InputIconStyle.d.ts"
|
||||||
|
}
|
Loading…
Reference in New Issue