Merge branch 'master' of https://github.com/primefaces/primevue
Cagatay Civici
commit
9d8e2cfd65
|
|
@ -1,9 +1,9 @@
|
|||
const InputSwitchProps = [
|
||||
const InputOtpProps = [
|
||||
{
|
||||
name: 'modelValue',
|
||||
type: 'boolean',
|
||||
default: 'null',
|
||||
description: 'Specifies whether a inputswitch should be checked or not.'
|
||||
description: 'Specifies whether a inputOtp should be checked or not.'
|
||||
},
|
||||
{
|
||||
name: 'trueValue',
|
||||
|
|
@ -55,7 +55,7 @@ const InputSwitchProps = [
|
|||
}
|
||||
];
|
||||
|
||||
const InputSwitchEvents = [
|
||||
const InputOtpEvents = [
|
||||
{
|
||||
name: 'click',
|
||||
description: 'Callback to invoke on click.'
|
||||
|
|
@ -71,10 +71,10 @@ const InputSwitchEvents = [
|
|||
];
|
||||
|
||||
module.exports = {
|
||||
inputswitch: {
|
||||
name: 'InputSwitch',
|
||||
description: 'InputSwitch is used to select a boolean value.',
|
||||
props: InputSwitchProps,
|
||||
events: InputSwitchEvents
|
||||
inputotp: {
|
||||
name: 'InputOtp',
|
||||
description: 'InputOtp is used to enter one time passwords.',
|
||||
props: InputOtpProps,
|
||||
events: InputOtpEvents
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -193,10 +193,11 @@ import InlineMessage from 'primevue/inlinemessage';
|
|||
import Inplace from 'primevue/inplace';
|
||||
import InputGroup from 'primevue/inputgroup';
|
||||
import InputGroupAddon from 'primevue/inputgroupaddon';
|
||||
import InputSwitch from 'primevue/inputswitch';
|
||||
import InputText from 'primevue/inputtext';
|
||||
import InputMask from 'primevue/inputmask';
|
||||
import InputNumber from 'primevue/inputnumber';
|
||||
import InputOtp from 'primevue/inputotp';
|
||||
import InputSwitch from 'primevue/inputswitch';
|
||||
import InputText from 'primevue/inputtext';
|
||||
import Knob from 'primevue/knob';
|
||||
import Listbox from 'primevue/listbox';
|
||||
import MegaMenu from 'primevue/megamenu';
|
||||
|
|
@ -313,6 +314,7 @@ app.component('InputGroupAddon', InputGroupAddon);
|
|||
app.component('InputIcon', InputIcon);
|
||||
app.component('InputMask', InputMask);
|
||||
app.component('InputNumber', InputNumber);
|
||||
app.component('InputOtp', InputOtp);
|
||||
app.component('InputSwitch', InputSwitch);
|
||||
app.component('InputText', InputText);
|
||||
app.component('Knob', Knob);
|
||||
|
|
|
|||
|
|
@ -1,22 +1,24 @@
|
|||
/**
|
||||
*
|
||||
* InputSwitch is used to select a boolean value.
|
||||
* InputOtp is used to enter one time passwords.
|
||||
*
|
||||
* [Live Demo](https://www.primevue.org/inputswitch/)
|
||||
* [Live Demo](https://www.primevue.org/inputotp/)
|
||||
*
|
||||
* @module inputotp
|
||||
*
|
||||
*/
|
||||
import { VNode } from 'vue';
|
||||
import { ComponentHooks } from '../basecomponent/BaseComponent';
|
||||
import { InputTextPassThroughOptions } from '../inputtext';
|
||||
import { PassThroughOptions } from '../passthrough';
|
||||
import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
|
||||
|
||||
export declare type InputSwitchPassThroughOptionType = InputSwitchPassThroughAttributes | ((options: InputSwitchPassThroughMethodOptions) => InputSwitchPassThroughAttributes | string) | string | null | undefined;
|
||||
export declare type InputOtpPassThroughOptionType = InputOtpPassThroughAttributes | ((options: InputOtpPassThroughMethodOptions) => InputOtpPassThroughAttributes | string) | string | null | undefined;
|
||||
|
||||
/**
|
||||
* Custom passthrough(pt) option method.
|
||||
*/
|
||||
export interface InputSwitchPassThroughMethodOptions {
|
||||
export interface InputOtpPassThroughMethodOptions {
|
||||
/**
|
||||
* Defines instance.
|
||||
*/
|
||||
|
|
@ -24,23 +26,15 @@ export interface InputSwitchPassThroughMethodOptions {
|
|||
/**
|
||||
* Defines valid properties.
|
||||
*/
|
||||
props: InputSwitchProps;
|
||||
props: InputOtpProps;
|
||||
/**
|
||||
* Defines current inline state.
|
||||
*/
|
||||
state: InputSwitchState;
|
||||
/**
|
||||
* Defines current options.
|
||||
*/
|
||||
context: InputSwitchContext;
|
||||
state: InputOtpState;
|
||||
/**
|
||||
* Defines valid attributes.
|
||||
*/
|
||||
attrs: any;
|
||||
/**
|
||||
* Defines parent options.
|
||||
*/
|
||||
parent: any;
|
||||
/**
|
||||
* Defines passthrough(pt) options in global config.
|
||||
*/
|
||||
|
|
@ -48,22 +42,33 @@ export interface InputSwitchPassThroughMethodOptions {
|
|||
}
|
||||
|
||||
/**
|
||||
* Custom passthrough(pt) options.
|
||||
* @see {@link InputSwitchProps.pt}
|
||||
* Custom shared passthrough(pt) option method.
|
||||
*/
|
||||
export interface InputSwitchPassThroughOptions {
|
||||
export interface InputOtpSharedPassThroughMethodOptions {
|
||||
/**
|
||||
* Defines valid properties.
|
||||
*/
|
||||
props: InputOtpProps;
|
||||
/**
|
||||
* Defines current inline state.
|
||||
*/
|
||||
state: InputOtpState;
|
||||
}
|
||||
|
||||
/**
|
||||
* Custom passthrough(pt) options.
|
||||
* @see {@link InputOtpProps.pt}
|
||||
*/
|
||||
export interface InputOtpPassThroughOptions {
|
||||
/**
|
||||
* Used to pass attributes to the root's DOM element.
|
||||
*/
|
||||
root?: InputSwitchPassThroughOptionType;
|
||||
root?: InputOtpPassThroughOptionType;
|
||||
/**
|
||||
* Used to pass attributes to the input's DOM element.
|
||||
* Used to pass attributes to the InputText component.
|
||||
* @see {@link InputTextPassThroughOptions}
|
||||
*/
|
||||
input?: InputSwitchPassThroughOptionType;
|
||||
/**
|
||||
* Used to pass attributes to the slider's DOM element.
|
||||
*/
|
||||
slider?: InputSwitchPassThroughOptionType;
|
||||
input?: InputTextPassThroughOptions<InputOtpSharedPassThroughMethodOptions>;
|
||||
/**
|
||||
* Used to manage all lifecycle hooks.
|
||||
* @see {@link BaseComponent.ComponentHooks}
|
||||
|
|
@ -74,36 +79,70 @@ export interface InputSwitchPassThroughOptions {
|
|||
/**
|
||||
* Custom passthrough attributes for each DOM elements
|
||||
*/
|
||||
export interface InputSwitchPassThroughAttributes {
|
||||
export interface InputOtpPassThroughAttributes {
|
||||
[key: string]: any;
|
||||
}
|
||||
|
||||
/**
|
||||
* Defines current inline state in InputSwitch component.
|
||||
* Defines current inline state in InputOtp component.
|
||||
*/
|
||||
export interface InputSwitchState {
|
||||
[key: string]: any;
|
||||
export interface InputOtpState {
|
||||
/**
|
||||
* Array of input tokens
|
||||
*/
|
||||
tokens: string[] | number[];
|
||||
}
|
||||
|
||||
/**
|
||||
* Defines valid properties in InputSwitch component.
|
||||
* InputOtp attr options
|
||||
*/
|
||||
export interface InputSwitchProps {
|
||||
export interface InputOtpTemplateAttrsOptions {
|
||||
/**
|
||||
* Specifies whether a inputswitch should be checked or not.
|
||||
* Input token value
|
||||
*/
|
||||
value: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* InputOtp templating events
|
||||
*/
|
||||
export interface InputOtpTemplateEvents {
|
||||
/**
|
||||
* Input event
|
||||
* @param {Event} event - Browser event
|
||||
*/
|
||||
input: (event: Event) => void;
|
||||
/**
|
||||
* Keydown event
|
||||
* @param {Event} event - Browser event
|
||||
*/
|
||||
keydown: (event: Event) => void;
|
||||
/**
|
||||
* Focus event
|
||||
* @param {Event} event - Browser event
|
||||
*/
|
||||
focus: (event: Event) => void;
|
||||
/**
|
||||
* Blur event
|
||||
* @param {Event} event - Browser event
|
||||
*/
|
||||
blur: (event: Event) => void;
|
||||
/**
|
||||
* Paste event
|
||||
* @param {Event} event - Browser event
|
||||
*/
|
||||
paste: (event: Event) => void;
|
||||
}
|
||||
|
||||
/**
|
||||
* Defines valid properties in InputOtp component.
|
||||
*/
|
||||
export interface InputOtpProps {
|
||||
/**
|
||||
* Specifies whether a inputotp should be checked or not.
|
||||
* @defaultValue false
|
||||
*/
|
||||
modelValue?: boolean | string | undefined;
|
||||
/**
|
||||
* Value in checked state.
|
||||
* @defaultValue true
|
||||
*/
|
||||
trueValue?: any;
|
||||
/**
|
||||
* Value in unchecked state.
|
||||
* @defaultValue false
|
||||
*/
|
||||
falseValue?: any;
|
||||
/**
|
||||
* When present, it specifies that the component should have invalid state style.
|
||||
* @defaultValue false
|
||||
|
|
@ -116,38 +155,38 @@ export interface InputSwitchProps {
|
|||
disabled?: boolean | undefined;
|
||||
/**
|
||||
* When present, it specifies that an input field is read-only.
|
||||
* @default false
|
||||
* @defaultValue false
|
||||
*/
|
||||
readonly?: boolean | undefined;
|
||||
/**
|
||||
* Specifies the input variant of the component.
|
||||
* @defaultValue outlined
|
||||
*/
|
||||
variant?: 'outlined' | 'filled' | undefined;
|
||||
/**
|
||||
* Index of the element in tabbing order.
|
||||
*/
|
||||
tabindex?: number | undefined;
|
||||
/**
|
||||
* Identifier of the underlying input element.
|
||||
* Number of characters to initiate.
|
||||
* @defaultValue 4
|
||||
*/
|
||||
inputId?: string | undefined;
|
||||
length?: number | undefined;
|
||||
/**
|
||||
* Style class of the input field.
|
||||
* Mask pattern.
|
||||
* @defaultValue false
|
||||
*/
|
||||
inputClass?: string | object | undefined;
|
||||
mask?: boolean | undefined;
|
||||
/**
|
||||
* Inline style of the input field.
|
||||
* When present, it specifies that an input field is integer-only.
|
||||
* @defaultValue false
|
||||
*/
|
||||
inputStyle?: object | undefined;
|
||||
/**
|
||||
* Establishes relationships between the component and label(s) where its value should be one or more element IDs.
|
||||
*/
|
||||
ariaLabelledby?: string | undefined;
|
||||
/**
|
||||
* Establishes a string value that labels the component.
|
||||
*/
|
||||
ariaLabel?: string | undefined;
|
||||
integerOnly?: boolean | undefined;
|
||||
/**
|
||||
* Used to pass attributes to DOM elements inside the component.
|
||||
* @type {InputSwitchPassThroughOptions}
|
||||
* @type {InputOtpPassThroughOptions}
|
||||
*/
|
||||
pt?: PassThrough<InputSwitchPassThroughOptions>;
|
||||
pt?: PassThrough<InputOtpPassThroughOptions>;
|
||||
/**
|
||||
* Used to configure passthrough(pt) options of the component.
|
||||
* @type {PassThroughOptions}
|
||||
|
|
@ -161,27 +200,36 @@ export interface InputSwitchProps {
|
|||
}
|
||||
|
||||
/**
|
||||
* Defines current options in InputSwitch component.
|
||||
*
|
||||
*/
|
||||
export interface InputSwitchContext {
|
||||
export interface InputOtpSlots {
|
||||
/**
|
||||
* Current checked state of the item as a boolean.
|
||||
* @defaultValue false
|
||||
* Default content slot.
|
||||
*/
|
||||
checked: boolean;
|
||||
default(scope: {
|
||||
/**
|
||||
* Current disabled state of the item as a boolean.
|
||||
* @defaultValue false
|
||||
* Events of the component
|
||||
* @param {number} index - Index of the input field
|
||||
* @return {InputOtpTemplateEvents}
|
||||
*/
|
||||
disabled: boolean;
|
||||
events: (index: number) => InputOtpTemplateEvents;
|
||||
/**
|
||||
* Attributes of the component
|
||||
* @param {number} index - Index of the input field
|
||||
* @return {InputOtpTemplateAttrsOptions}
|
||||
*/
|
||||
attrs: (index: number) => InputOtpTemplateAttrsOptions;
|
||||
/**
|
||||
* Index of the input field
|
||||
*/
|
||||
index: number;
|
||||
}): VNode[];
|
||||
}
|
||||
|
||||
export interface InputSwitchSlots {}
|
||||
|
||||
/**
|
||||
* Defines valid emits in InputSwitch component.
|
||||
* Defines valid emits in InputOtp component.
|
||||
*/
|
||||
export interface InputSwitchEmits {
|
||||
export interface InputOtpEmits {
|
||||
/**
|
||||
* Emitted when the value changes.
|
||||
* @param {boolean} value - New value.
|
||||
|
|
@ -205,23 +253,23 @@ export interface InputSwitchEmits {
|
|||
}
|
||||
|
||||
/**
|
||||
* **PrimeVue - InputSwitch**
|
||||
* **PrimeVue - InputOtp**
|
||||
*
|
||||
* _InputSwitch is used to select a boolean value._
|
||||
* _InputOtp is used to enter one time passwords._
|
||||
*
|
||||
* [Live Demo](https://www.primevue.org/inputswitch/)
|
||||
* [Live Demo](https://www.primevue.org/inputotp/)
|
||||
* --- ---
|
||||
* 
|
||||
*
|
||||
* @group Component
|
||||
*
|
||||
*/
|
||||
declare class InputSwitch extends ClassComponent<InputSwitchProps, InputSwitchSlots, InputSwitchEmits> {}
|
||||
declare class InputOtp extends ClassComponent<InputOtpProps, InputOtpSlots, InputOtpEmits> {}
|
||||
|
||||
declare module '@vue/runtime-core' {
|
||||
interface GlobalComponents {
|
||||
InputSwitch: GlobalComponentConstructor<InputSwitch>;
|
||||
InputOtp: GlobalComponentConstructor<InputOtp>;
|
||||
}
|
||||
}
|
||||
|
||||
export default InputSwitch;
|
||||
export default InputOtp;
|
||||
|
|
|
|||
|
|
@ -12,6 +12,7 @@
|
|||
:disabled="disabled"
|
||||
:invalid="invalid"
|
||||
:tabindex="tabindex"
|
||||
:unstyled="unstyled"
|
||||
@input="onInput($event, i - 1)"
|
||||
@focus="onFocus($event)"
|
||||
@blur="onBlur($event)"
|
||||
|
|
@ -91,7 +92,7 @@ export default {
|
|||
});
|
||||
},
|
||||
moveToPrev(event) {
|
||||
var prevInput = this.findPrevInput(event.target);
|
||||
let prevInput = this.findPrevInput(event.target);
|
||||
|
||||
if (prevInput) {
|
||||
prevInput.focus();
|
||||
|
|
@ -99,7 +100,7 @@ export default {
|
|||
}
|
||||
},
|
||||
moveToNext(event) {
|
||||
var nextInput = this.findNextInput(event.target);
|
||||
let nextInput = this.findNextInput(event.target);
|
||||
|
||||
if (nextInput) {
|
||||
nextInput.focus();
|
||||
|
|
@ -107,12 +108,16 @@ export default {
|
|||
}
|
||||
},
|
||||
findNextInput(element) {
|
||||
var nextElement = element.nextElementSibling;
|
||||
let nextElement = element.nextElementSibling;
|
||||
|
||||
if (!nextElement) return;
|
||||
|
||||
return nextElement.nodeName === 'INPUT' ? nextElement : this.findNextInput(nextElement);
|
||||
},
|
||||
findPrevInput(element) {
|
||||
var prevElement = element.previousElementSibling;
|
||||
let prevElement = element.previousElementSibling;
|
||||
|
||||
if (!prevElement) return;
|
||||
|
||||
return prevElement.nodeName === 'INPUT' ? prevElement : this.findPrevInput(prevElement);
|
||||
},
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import BaseStyle from 'primevue/base/style';
|
||||
|
||||
const classes = {
|
||||
root: ({ props }) => ['p-inputotp p-component'],
|
||||
root: 'p-inputotp p-component',
|
||||
input: 'p-inputotp-input'
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -25,10 +25,6 @@ export interface InputSwitchPassThroughMethodOptions {
|
|||
* Defines valid properties.
|
||||
*/
|
||||
props: InputSwitchProps;
|
||||
/**
|
||||
* Defines current inline state.
|
||||
*/
|
||||
state: InputSwitchState;
|
||||
/**
|
||||
* Defines current options.
|
||||
*/
|
||||
|
|
@ -78,13 +74,6 @@ export interface InputSwitchPassThroughAttributes {
|
|||
[key: string]: any;
|
||||
}
|
||||
|
||||
/**
|
||||
* Defines current inline state in InputSwitch component.
|
||||
*/
|
||||
export interface InputSwitchState {
|
||||
[key: string]: any;
|
||||
}
|
||||
|
||||
/**
|
||||
* Defines valid properties in InputSwitch component.
|
||||
*/
|
||||
|
|
|
|||
|
|
@ -31975,10 +31975,10 @@
|
|||
}
|
||||
},
|
||||
"inputotp": {
|
||||
"description": "InputSwitch is used to select a boolean value.\n\n[Live Demo](https://www.primevue.org/inputswitch/)",
|
||||
"description": "InputOtp is used to enter one time passwords.\n\n[Live Demo](https://www.primevue.org/inputotp/)",
|
||||
"components": {
|
||||
"default": {
|
||||
"description": "InputSwitch is used to select a boolean value.",
|
||||
"description": "InputOtp is used to enter one time passwords.",
|
||||
"methods": {
|
||||
"description": "Defines methods that can be accessed by the component's reference.",
|
||||
"values": []
|
||||
|
|
@ -31991,7 +31991,7 @@
|
|||
"methodDescription": "Defines methods that can be accessed by the component's reference.",
|
||||
"typeDescription": "Defines the custom types used by the module.",
|
||||
"values": {
|
||||
"InputSwitchPassThroughMethodOptions": {
|
||||
"InputOtpPassThroughMethodOptions": {
|
||||
"description": "Custom passthrough(pt) option method.",
|
||||
"relatedProp": "",
|
||||
"props": [
|
||||
|
|
@ -32007,7 +32007,7 @@
|
|||
"name": "props",
|
||||
"optional": false,
|
||||
"readonly": false,
|
||||
"type": "InputSwitchProps",
|
||||
"type": "InputOtpProps",
|
||||
"default": "",
|
||||
"description": "Defines valid properties."
|
||||
},
|
||||
|
|
@ -32015,18 +32015,10 @@
|
|||
"name": "state",
|
||||
"optional": false,
|
||||
"readonly": false,
|
||||
"type": "InputSwitchState",
|
||||
"type": "InputOtpState",
|
||||
"default": "",
|
||||
"description": "Defines current inline state."
|
||||
},
|
||||
{
|
||||
"name": "context",
|
||||
"optional": false,
|
||||
"readonly": false,
|
||||
"type": "InputSwitchContext",
|
||||
"default": "",
|
||||
"description": "Defines current options."
|
||||
},
|
||||
{
|
||||
"name": "attrs",
|
||||
"optional": false,
|
||||
|
|
@ -32035,14 +32027,6 @@
|
|||
"default": "",
|
||||
"description": "Defines valid attributes."
|
||||
},
|
||||
{
|
||||
"name": "parent",
|
||||
"optional": false,
|
||||
"readonly": false,
|
||||
"type": "any",
|
||||
"default": "",
|
||||
"description": "Defines parent options."
|
||||
},
|
||||
{
|
||||
"name": "global",
|
||||
"optional": false,
|
||||
|
|
@ -32054,15 +32038,38 @@
|
|||
],
|
||||
"methods": []
|
||||
},
|
||||
"InputSwitchPassThroughOptions": {
|
||||
"InputOtpSharedPassThroughMethodOptions": {
|
||||
"description": "Custom shared passthrough(pt) option method.",
|
||||
"relatedProp": "",
|
||||
"props": [
|
||||
{
|
||||
"name": "props",
|
||||
"optional": false,
|
||||
"readonly": false,
|
||||
"type": "InputOtpProps",
|
||||
"default": "",
|
||||
"description": "Defines valid properties."
|
||||
},
|
||||
{
|
||||
"name": "state",
|
||||
"optional": false,
|
||||
"readonly": false,
|
||||
"type": "InputOtpState",
|
||||
"default": "",
|
||||
"description": "Defines current inline state."
|
||||
}
|
||||
],
|
||||
"methods": []
|
||||
},
|
||||
"InputOtpPassThroughOptions": {
|
||||
"description": "Custom passthrough(pt) options.",
|
||||
"relatedProp": "InputSwitchProps.pt",
|
||||
"relatedProp": "InputOtpProps.pt",
|
||||
"props": [
|
||||
{
|
||||
"name": "root",
|
||||
"optional": true,
|
||||
"readonly": false,
|
||||
"type": "InputSwitchPassThroughOptionType",
|
||||
"type": "InputOtpPassThroughOptionType",
|
||||
"default": "",
|
||||
"description": "Used to pass attributes to the root's DOM element."
|
||||
},
|
||||
|
|
@ -32070,17 +32077,9 @@
|
|||
"name": "input",
|
||||
"optional": true,
|
||||
"readonly": false,
|
||||
"type": "InputSwitchPassThroughOptionType",
|
||||
"type": "InputTextPassThroughOptions<InputOtpSharedPassThroughMethodOptions>",
|
||||
"default": "",
|
||||
"description": "Used to pass attributes to the input's DOM element."
|
||||
},
|
||||
{
|
||||
"name": "slider",
|
||||
"optional": true,
|
||||
"readonly": false,
|
||||
"type": "InputSwitchPassThroughOptionType",
|
||||
"default": "",
|
||||
"description": "Used to pass attributes to the slider's DOM element."
|
||||
"description": "Used to pass attributes to the InputText component."
|
||||
},
|
||||
{
|
||||
"name": "hooks",
|
||||
|
|
@ -32093,7 +32092,7 @@
|
|||
],
|
||||
"methods": []
|
||||
},
|
||||
"InputSwitchPassThroughAttributes": {
|
||||
"InputOtpPassThroughAttributes": {
|
||||
"description": "Custom passthrough attributes for each DOM elements",
|
||||
"relatedProp": "",
|
||||
"props": [
|
||||
|
|
@ -32106,21 +32105,80 @@
|
|||
],
|
||||
"methods": []
|
||||
},
|
||||
"InputSwitchState": {
|
||||
"description": "Defines current inline state in InputSwitch component.",
|
||||
"InputOtpState": {
|
||||
"description": "Defines current inline state in InputOtp component.",
|
||||
"relatedProp": "",
|
||||
"props": [
|
||||
{
|
||||
"name": "[key: string]",
|
||||
"name": "tokens",
|
||||
"optional": false,
|
||||
"readonly": false,
|
||||
"type": "any"
|
||||
"type": "string[] | number[]",
|
||||
"default": "",
|
||||
"description": "Array of input tokens"
|
||||
}
|
||||
],
|
||||
"methods": []
|
||||
},
|
||||
"InputSwitchProps": {
|
||||
"description": "Defines valid properties in InputSwitch component.",
|
||||
"InputOtpTemplateAttrsOptions": {
|
||||
"description": "InputOtp attr options",
|
||||
"relatedProp": "",
|
||||
"props": [
|
||||
{
|
||||
"name": "value",
|
||||
"optional": false,
|
||||
"readonly": false,
|
||||
"type": "string",
|
||||
"default": "",
|
||||
"description": "Input token value"
|
||||
}
|
||||
],
|
||||
"methods": []
|
||||
},
|
||||
"InputOtpTemplateEvents": {
|
||||
"description": "InputOtp templating events",
|
||||
"relatedProp": "",
|
||||
"props": [
|
||||
{
|
||||
"name": "input",
|
||||
"optional": false,
|
||||
"readonly": false,
|
||||
"type": "Function",
|
||||
"default": ""
|
||||
},
|
||||
{
|
||||
"name": "keydown",
|
||||
"optional": false,
|
||||
"readonly": false,
|
||||
"type": "Function",
|
||||
"default": ""
|
||||
},
|
||||
{
|
||||
"name": "focus",
|
||||
"optional": false,
|
||||
"readonly": false,
|
||||
"type": "Function",
|
||||
"default": ""
|
||||
},
|
||||
{
|
||||
"name": "blur",
|
||||
"optional": false,
|
||||
"readonly": false,
|
||||
"type": "Function",
|
||||
"default": ""
|
||||
},
|
||||
{
|
||||
"name": "paste",
|
||||
"optional": false,
|
||||
"readonly": false,
|
||||
"type": "Function",
|
||||
"default": ""
|
||||
}
|
||||
],
|
||||
"methods": []
|
||||
},
|
||||
"InputOtpProps": {
|
||||
"description": "Defines valid properties in InputOtp component.",
|
||||
"relatedProp": "",
|
||||
"props": [
|
||||
{
|
||||
|
|
@ -32129,23 +32187,7 @@
|
|||
"readonly": false,
|
||||
"type": "string | boolean",
|
||||
"default": "false",
|
||||
"description": "Specifies whether a inputswitch should be checked or not."
|
||||
},
|
||||
{
|
||||
"name": "trueValue",
|
||||
"optional": true,
|
||||
"readonly": false,
|
||||
"type": "any",
|
||||
"default": "true",
|
||||
"description": "Value in checked state."
|
||||
},
|
||||
{
|
||||
"name": "falseValue",
|
||||
"optional": true,
|
||||
"readonly": false,
|
||||
"type": "any",
|
||||
"default": "false",
|
||||
"description": "Value in unchecked state."
|
||||
"description": "Specifies whether a inputotp should be checked or not."
|
||||
},
|
||||
{
|
||||
"name": "invalid",
|
||||
|
|
@ -32168,9 +32210,17 @@
|
|||
"optional": true,
|
||||
"readonly": false,
|
||||
"type": "boolean",
|
||||
"default": "",
|
||||
"default": "false",
|
||||
"description": "When present, it specifies that an input field is read-only."
|
||||
},
|
||||
{
|
||||
"name": "variant",
|
||||
"optional": true,
|
||||
"readonly": false,
|
||||
"type": "\"filled\" | \"outlined\"",
|
||||
"default": "outlined",
|
||||
"description": "Specifies the input variant of the component."
|
||||
},
|
||||
{
|
||||
"name": "tabindex",
|
||||
"optional": true,
|
||||
|
|
@ -32180,50 +32230,34 @@
|
|||
"description": "Index of the element in tabbing order."
|
||||
},
|
||||
{
|
||||
"name": "inputId",
|
||||
"name": "length",
|
||||
"optional": true,
|
||||
"readonly": false,
|
||||
"type": "string",
|
||||
"default": "",
|
||||
"description": "Identifier of the underlying input element."
|
||||
"type": "number",
|
||||
"default": "4",
|
||||
"description": "Number of characters to initiate."
|
||||
},
|
||||
{
|
||||
"name": "inputClass",
|
||||
"name": "mask",
|
||||
"optional": true,
|
||||
"readonly": false,
|
||||
"type": "string | object",
|
||||
"default": "",
|
||||
"description": "Style class of the input field."
|
||||
"type": "boolean",
|
||||
"default": "false",
|
||||
"description": "Mask pattern."
|
||||
},
|
||||
{
|
||||
"name": "inputStyle",
|
||||
"name": "integerOnly",
|
||||
"optional": true,
|
||||
"readonly": false,
|
||||
"type": "object",
|
||||
"default": "",
|
||||
"description": "Inline style of the input field."
|
||||
},
|
||||
{
|
||||
"name": "ariaLabelledby",
|
||||
"optional": true,
|
||||
"readonly": false,
|
||||
"type": "string",
|
||||
"default": "",
|
||||
"description": "Establishes relationships between the component and label(s) where its value should be one or more element IDs."
|
||||
},
|
||||
{
|
||||
"name": "ariaLabel",
|
||||
"optional": true,
|
||||
"readonly": false,
|
||||
"type": "string",
|
||||
"default": "",
|
||||
"description": "Establishes a string value that labels the component."
|
||||
"type": "boolean",
|
||||
"default": "false",
|
||||
"description": "When present, it specifies that an input field is integer-only."
|
||||
},
|
||||
{
|
||||
"name": "pt",
|
||||
"optional": true,
|
||||
"readonly": false,
|
||||
"type": "PassThrough<InputSwitchPassThroughOptions>",
|
||||
"type": "PassThrough<InputOtpPassThroughOptions>",
|
||||
"default": "",
|
||||
"description": "Used to pass attributes to DOM elements inside the component."
|
||||
},
|
||||
|
|
@ -32246,36 +32280,27 @@
|
|||
],
|
||||
"methods": []
|
||||
},
|
||||
"InputSwitchContext": {
|
||||
"description": "Defines current options in InputSwitch component.",
|
||||
"relatedProp": "",
|
||||
"props": [
|
||||
{
|
||||
"name": "checked",
|
||||
"optional": false,
|
||||
"readonly": false,
|
||||
"type": "boolean",
|
||||
"default": "false",
|
||||
"description": "Current checked state of the item as a boolean."
|
||||
},
|
||||
{
|
||||
"name": "disabled",
|
||||
"optional": false,
|
||||
"readonly": false,
|
||||
"type": "boolean",
|
||||
"default": "false",
|
||||
"description": "Current disabled state of the item as a boolean."
|
||||
}
|
||||
],
|
||||
"methods": []
|
||||
},
|
||||
"InputSwitchSlots": {
|
||||
"InputOtpSlots": {
|
||||
"description": "",
|
||||
"relatedProp": "",
|
||||
"props": [],
|
||||
"methods": []
|
||||
"methods": [
|
||||
{
|
||||
"name": "default",
|
||||
"parameters": [
|
||||
{
|
||||
"name": "scope",
|
||||
"optional": false,
|
||||
"type": "{\n \t <span class=\"ml-3 doc-option-parameter-name\">events</span>: <span class=\"doc-option-parameter-type\">(<span class=\"doc-option-parameter-name\">index</span>: number) ⇒ InputOtpTemplateEvents</span>, <span class=\"doc-option-parameter-type\">// Events of the component</span>\n\t <span class=\"ml-3 doc-option-parameter-name\">attrs</span>: <span class=\"doc-option-parameter-type\">(<span class=\"doc-option-parameter-name\">index</span>: number) ⇒ InputOtpTemplateAttrsOptions</span>, <span class=\"doc-option-parameter-type\">// Attributes of the component</span>\n \t <span class=\"ml-3 doc-option-parameter-name\">index</span>: <span class=\"doc-option-parameter-type\">number</span>, <span class=\"doc-option-parameter-type\">// Index of the input field</span>\n }"
|
||||
}
|
||||
],
|
||||
"returnType": "VNode<RendererNode, RendererElement, Object>[]",
|
||||
"description": "Default content slot."
|
||||
}
|
||||
]
|
||||
},
|
||||
"InputSwitchEmits": {
|
||||
"description": "Defines valid emits in InputSwitch component.",
|
||||
"InputOtpEmits": {
|
||||
"description": "Defines valid emits in InputOtp component.",
|
||||
"relatedProp": "",
|
||||
"props": [],
|
||||
"methods": [
|
||||
|
|
@ -32338,8 +32363,8 @@
|
|||
"types": {
|
||||
"description": "Defines the custom types used by the module.",
|
||||
"values": {
|
||||
"InputSwitchPassThroughOptionType": {
|
||||
"values": "InputSwitchPassThroughAttributes | (options: InputSwitchPassThroughMethodOptions) => undefined | string | null | undefined"
|
||||
"InputOtpPassThroughOptionType": {
|
||||
"values": "InputOtpPassThroughAttributes | (options: InputOtpPassThroughMethodOptions) => undefined | string | null | undefined"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -32440,14 +32465,6 @@
|
|||
"default": "",
|
||||
"description": "Defines valid properties."
|
||||
},
|
||||
{
|
||||
"name": "state",
|
||||
"optional": false,
|
||||
"readonly": false,
|
||||
"type": "InputSwitchState",
|
||||
"default": "",
|
||||
"description": "Defines current inline state."
|
||||
},
|
||||
{
|
||||
"name": "context",
|
||||
"optional": false,
|
||||
|
|
@ -32535,19 +32552,6 @@
|
|||
],
|
||||
"methods": []
|
||||
},
|
||||
"InputSwitchState": {
|
||||
"description": "Defines current inline state in InputSwitch component.",
|
||||
"relatedProp": "",
|
||||
"props": [
|
||||
{
|
||||
"name": "[key: string]",
|
||||
"optional": false,
|
||||
"readonly": false,
|
||||
"type": "any"
|
||||
}
|
||||
],
|
||||
"methods": []
|
||||
},
|
||||
"InputSwitchProps": {
|
||||
"description": "Defines valid properties in InputSwitch component.",
|
||||
"relatedProp": "",
|
||||
|
|
|
|||
|
|
@ -23,7 +23,11 @@
|
|||
</tr>
|
||||
<tr>
|
||||
<td><i>left arrow</i></td>
|
||||
<td>Moves focus to the next previous element.</td>
|
||||
<td>Moves focus to the previous input element.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><i>backspace</i></td>
|
||||
<td>Deletes the input and moves focus to the previous input element.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
|
|
|||
|
|
@ -3,6 +3,6 @@
|
|||
<p>{{ $attrs.description }}</p>
|
||||
</DocSectionText>
|
||||
<div class="card">
|
||||
<img class="w-full" src="https://primefaces.org/cdn/primevue/images/pt/inputswitch.jpg" />
|
||||
<img class="w-full" src="https://primefaces.org/cdn/primevue/images/pt/wireframe-placeholder.jpg" />
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="doc-main">
|
||||
<div class="doc-intro">
|
||||
<h1>InputSwitch Pass Through</h1>
|
||||
<h1>InputOtp Pass Through</h1>
|
||||
</div>
|
||||
<DocSections :docs="docs" />
|
||||
</div>
|
||||
|
|
@ -23,10 +23,10 @@ export default {
|
|||
component: PTImage
|
||||
},
|
||||
{
|
||||
id: 'pt.doc.inputswitch',
|
||||
label: 'InputSwitch PT Options',
|
||||
id: 'pt.doc.inputotp',
|
||||
label: 'InputOtp PT Options',
|
||||
component: DocApiTable,
|
||||
data: getPTOption('InputSwitch')
|
||||
data: getPTOption('InputOtp')
|
||||
}
|
||||
]
|
||||
};
|
||||
|
|
|
|||
|
|
@ -12,16 +12,12 @@
|
|||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>p-inputswitch</td>
|
||||
<td>p-inputotp</td>
|
||||
<td>Container element.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>p-inputswitch-checked</td>
|
||||
<td>Container element in active state.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>p-inputswitch-slider</td>
|
||||
<td>Slider element behind the handle.</td>
|
||||
<td>p-inputotp-input</td>
|
||||
<td>Input element of the component.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
|
|
|||
Loading…
Reference in New Issue