Merge branch 'master' into v4
commit
6479cad038
|
@ -182,7 +182,12 @@ export default {
|
|||
}
|
||||
},
|
||||
setPasswordMeter() {
|
||||
if (!this.modelValue) return;
|
||||
if (!this.modelValue) {
|
||||
this.meter = null;
|
||||
this.infoText = this.promptText;
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
const { meter, label } = this.checkPasswordStrength(this.modelValue);
|
||||
|
||||
|
|
|
@ -0,0 +1,53 @@
|
|||
<template>
|
||||
<DocSectionText v-bind="$attrs">
|
||||
<p>
|
||||
The declarative syntax provides an alternative to the programmatic syntax. The attributes that start with <i>pt</i> are interpreted differently by the component based on the format below. An IDE extension is also being planned to
|
||||
autocomplete the values for better developer experience in the future.
|
||||
</p>
|
||||
<DocSectionCode :code="code1" hideToggleCode hideStackBlitz />
|
||||
<p>Here is another example using both syntax alternatives for the same options.</p>
|
||||
<DocSectionCode :code="code2" hideToggleCode hideStackBlitz />
|
||||
<DocSectionCode :code="code3" hideToggleCode hideStackBlitz />
|
||||
</DocSectionText>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
code1: {
|
||||
basic: `
|
||||
<ComponentTag pt:[passthrough_key]:[attribute]="value" />
|
||||
`
|
||||
},
|
||||
code2: {
|
||||
basic: `
|
||||
<Panel
|
||||
:pt="{
|
||||
root: {
|
||||
class='"border-1 border-solid'
|
||||
},
|
||||
header: {
|
||||
'data-test-id': 'testid',
|
||||
class: 'bg-blue-500',
|
||||
onClick: onHeaderClick
|
||||
}
|
||||
}"
|
||||
>
|
||||
`
|
||||
},
|
||||
code3: {
|
||||
basic: `
|
||||
<Panel
|
||||
pt:root:class="border-1 border-solid"
|
||||
pt:header:id="headerId"
|
||||
pt:header:data-test-id="testId"
|
||||
pt:header:class="bg-blue-500"
|
||||
:pt:header:onClick="onHeaderClick"
|
||||
>
|
||||
`
|
||||
}
|
||||
};
|
||||
}
|
||||
};
|
||||
</script>
|
|
@ -18,6 +18,7 @@
|
|||
<script>
|
||||
import BasicDoc from '@/doc/passthrough/BasicDoc.vue';
|
||||
import CustomCSSDoc from '@/doc/passthrough/CustomCSSDoc.vue';
|
||||
import DeclarativeDoc from '@/doc/passthrough/DeclarativeDoc.vue';
|
||||
import GlobalDoc from '@/doc/passthrough/GlobalDoc.vue';
|
||||
import LifecycleDoc from '@/doc/passthrough/LifecycleDoc.vue';
|
||||
import UsePassThroughDoc from '@/doc/passthrough/UsePassThroughDoc.vue';
|
||||
|
@ -31,6 +32,11 @@ export default {
|
|||
label: 'Basic',
|
||||
component: BasicDoc
|
||||
},
|
||||
{
|
||||
id: 'declarative',
|
||||
label: 'Declarative',
|
||||
component: DeclarativeDoc
|
||||
},
|
||||
{
|
||||
id: 'lifecycle',
|
||||
label: 'Lifecycle',
|
||||
|
|
|
@ -11187,6 +11187,7 @@
|
|||
|
||||
.p-fileupload .p-fileupload-content {
|
||||
border-top: 0 none;
|
||||
padding-top: 1.125rem;
|
||||
}
|
||||
|
||||
.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button {
|
||||
|
|
|
@ -11187,6 +11187,7 @@
|
|||
|
||||
.p-fileupload .p-fileupload-content {
|
||||
border-top: 0 none;
|
||||
padding-top: 1.125rem;
|
||||
}
|
||||
|
||||
.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button {
|
||||
|
|
|
@ -11187,6 +11187,7 @@
|
|||
|
||||
.p-fileupload .p-fileupload-content {
|
||||
border-top: 0 none;
|
||||
padding-top: 1.125rem;
|
||||
}
|
||||
|
||||
.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button {
|
||||
|
|
|
@ -11187,6 +11187,7 @@
|
|||
|
||||
.p-fileupload .p-fileupload-content {
|
||||
border-top: 0 none;
|
||||
padding-top: 1.125rem;
|
||||
}
|
||||
|
||||
.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button {
|
||||
|
|
|
@ -11187,6 +11187,7 @@
|
|||
|
||||
.p-fileupload .p-fileupload-content {
|
||||
border-top: 0 none;
|
||||
padding-top: 1.125rem;
|
||||
}
|
||||
|
||||
.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button {
|
||||
|
|
|
@ -11187,6 +11187,7 @@
|
|||
|
||||
.p-fileupload .p-fileupload-content {
|
||||
border-top: 0 none;
|
||||
padding-top: 1.125rem;
|
||||
}
|
||||
|
||||
.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button {
|
||||
|
|
|
@ -11187,6 +11187,7 @@
|
|||
|
||||
.p-fileupload .p-fileupload-content {
|
||||
border-top: 0 none;
|
||||
padding-top: 1.125rem;
|
||||
}
|
||||
|
||||
.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button {
|
||||
|
|
|
@ -11187,6 +11187,7 @@
|
|||
|
||||
.p-fileupload .p-fileupload-content {
|
||||
border-top: 0 none;
|
||||
padding-top: 1.125rem;
|
||||
}
|
||||
|
||||
.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button {
|
||||
|
|
|
@ -11187,6 +11187,7 @@
|
|||
|
||||
.p-fileupload .p-fileupload-content {
|
||||
border-top: 0 none;
|
||||
padding-top: 1.125rem;
|
||||
}
|
||||
|
||||
.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button {
|
||||
|
|
|
@ -11187,6 +11187,7 @@
|
|||
|
||||
.p-fileupload .p-fileupload-content {
|
||||
border-top: 0 none;
|
||||
padding-top: 1.125rem;
|
||||
}
|
||||
|
||||
.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button {
|
||||
|
|
|
@ -11188,6 +11188,7 @@
|
|||
|
||||
.p-fileupload .p-fileupload-content {
|
||||
border-top: 0 none;
|
||||
padding-top: 1.125rem;
|
||||
}
|
||||
|
||||
.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button {
|
||||
|
|
|
@ -11188,6 +11188,7 @@
|
|||
|
||||
.p-fileupload .p-fileupload-content {
|
||||
border-top: 0 none;
|
||||
padding-top: 1.125rem;
|
||||
}
|
||||
|
||||
.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button {
|
||||
|
|
|
@ -11188,6 +11188,7 @@
|
|||
|
||||
.p-fileupload .p-fileupload-content {
|
||||
border-top: 0 none;
|
||||
padding-top: 1.125rem;
|
||||
}
|
||||
|
||||
.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button {
|
||||
|
|
|
@ -11188,6 +11188,7 @@
|
|||
|
||||
.p-fileupload .p-fileupload-content {
|
||||
border-top: 0 none;
|
||||
padding-top: 1.125rem;
|
||||
}
|
||||
|
||||
.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button {
|
||||
|
|
|
@ -11188,6 +11188,7 @@
|
|||
|
||||
.p-fileupload .p-fileupload-content {
|
||||
border-top: 0 none;
|
||||
padding-top: 1.125rem;
|
||||
}
|
||||
|
||||
.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button {
|
||||
|
|
|
@ -11188,6 +11188,7 @@
|
|||
|
||||
.p-fileupload .p-fileupload-content {
|
||||
border-top: 0 none;
|
||||
padding-top: 1.125rem;
|
||||
}
|
||||
|
||||
.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button {
|
||||
|
|
|
@ -11196,6 +11196,7 @@
|
|||
|
||||
.p-fileupload .p-fileupload-content {
|
||||
border-top: 0 none;
|
||||
padding-top: 1.125rem;
|
||||
}
|
||||
|
||||
.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button {
|
||||
|
|
|
@ -11188,6 +11188,7 @@
|
|||
|
||||
.p-fileupload .p-fileupload-content {
|
||||
border-top: 0 none;
|
||||
padding-top: 1.125rem;
|
||||
}
|
||||
|
||||
.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button {
|
||||
|
|
|
@ -11188,6 +11188,7 @@
|
|||
|
||||
.p-fileupload .p-fileupload-content {
|
||||
border-top: 0 none;
|
||||
padding-top: 1.125rem;
|
||||
}
|
||||
|
||||
.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button {
|
||||
|
|
|
@ -11188,6 +11188,7 @@
|
|||
|
||||
.p-fileupload .p-fileupload-content {
|
||||
border-top: 0 none;
|
||||
padding-top: 1.125rem;
|
||||
}
|
||||
|
||||
.p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button {
|
||||
|
|
Loading…
Reference in New Issue