Skip to content

Commit

Permalink
Merge branch 'master' into fix/primefaces#6054
Browse files Browse the repository at this point in the history
  • Loading branch information
charithAmila authored Mar 13, 2024
2 parents 34dc04b + 2d66a30 commit 3d09917
Show file tree
Hide file tree
Showing 85 changed files with 16,016 additions and 3,990 deletions.
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@ tsconfig.tsbuildinfo
# misc
.DS_Store
*.pem
*.code-workspace

# debug
npm-debug.log*
Expand Down
280 changes: 280 additions & 0 deletions components/doc/common/apidoc/index.json
Original file line number Diff line number Diff line change
Expand Up @@ -34566,6 +34566,286 @@
}
}
},
"metergroup": {
"description": "MeterGroup displays scalar measurements within a known range.\n\n[Live Demo](https://www.primereact.org/metergroup/)",
"components": {
"MeterGroup": {
"description": "MeterGroup is an extension to standard input element with theming and keyfiltering.",
"methods": {
"description": "Defines methods that can be accessed by the component's reference.",
"values": []
},
"props": {
"description": "Defines valid properties in MeterGroup component. In addition to these, all properties of HTMLDivElement can be used in this component.",
"values": [
{
"name": "className",
"optional": true,
"readonly": false,
"type": "string",
"default": "",
"description": "Additional CSS classes to apply to the MeterGroup."
},
{
"name": "end",
"optional": true,
"readonly": false,
"type": "Function",
"default": ""
},
{
"name": "labelList",
"optional": true,
"readonly": false,
"type": "Function",
"default": ""
},
{
"name": "labelOrientation",
"optional": true,
"readonly": false,
"type": "\"horizontal\" | \"vertical\"",
"default": "'horizontal'",
"description": "The orientation of the label. Can be either 'horizontal' or 'vertical'."
},
{
"name": "labelPosition",
"optional": true,
"readonly": false,
"type": "\"end\" | \"start\"",
"default": "'end'",
"description": "The position of the label. Can be either 'start' or 'end'."
},
{
"name": "max",
"optional": true,
"readonly": false,
"type": "number",
"default": "100",
"description": "The maximum value for the MeterGroup."
},
{
"name": "meter",
"optional": true,
"readonly": false,
"type": "Function",
"default": ""
},
{
"name": "min",
"optional": true,
"readonly": false,
"type": "number",
"default": "0",
"description": "The minimum value for the MeterGroup."
},
{
"name": "orientation",
"optional": true,
"readonly": false,
"type": "\"horizontal\" | \"vertical\"",
"default": "'horizontal'",
"description": "The orientation of the MeterGroup. Can be either 'horizontal' or 'vertical'."
},
{
"name": "pt",
"optional": true,
"readonly": false,
"type": "MeterGroupPassThroughOptions",
"default": "",
"description": "Uses to pass attributes to DOM elements inside the component."
},
{
"name": "ptOptions",
"optional": true,
"readonly": false,
"type": "PassThroughOptions",
"default": "",
"description": "Used to configure passthrough(pt) options of the component."
},
{
"name": "start",
"optional": true,
"readonly": false,
"type": "Function",
"default": ""
},
{
"name": "values",
"optional": true,
"readonly": false,
"type": "MeterGroupValue[]",
"default": "",
"description": "An array of values to be represented by the MeterGroup."
}
]
},
"callbacks": {
"description": "Defines callbacks that determine the behavior of the component based on a given condition or report the actions that the component takes.",
"values": []
}
}
},
"interfaces": {
"description": "Defines the custom interfaces used by the module.",
"values": {
"MeterGroupContext": {
"description": "Defines current options in MeterGroup component.",
"relatedProp": "",
"props": [
{
"name": "disabled",
"optional": false,
"readonly": false,
"type": "boolean",
"description": "Current disabled state of the component as a boolean."
}
],
"callbacks": []
},
"MeterGroupPassThroughMethodOptions": {
"description": "Custom passthrough(pt) option method.",
"relatedProp": "",
"props": [
{
"name": "props",
"optional": false,
"readonly": false,
"type": "MeterGroupProps"
},
{
"name": "context",
"optional": false,
"readonly": false,
"type": "MeterGroupContext"
}
],
"callbacks": []
},
"MeterGroupPassThroughOptions": {
"description": "Custom passthrough(pt) options.",
"relatedProp": "pt",
"props": [
{
"name": "root",
"optional": true,
"readonly": false,
"type": "MeterGroupPassThroughType<HTMLAttributes<HTMLDivElement>>",
"description": "Used to pass attributes to the root's DOM element."
},
{
"name": "labellist",
"optional": true,
"readonly": false,
"type": "MeterGroupPassThroughType<HTMLAttributes<HTMLOListElement>>",
"description": "Used to pass attributes to the label list's DOM element."
},
{
"name": "labellistitem",
"optional": true,
"readonly": false,
"type": "MeterGroupPassThroughType<HTMLAttributes<HTMLLIElement>>",
"description": "Used to pass attributes to the label list item's DOM element."
},
{
"name": "labellisttype",
"optional": true,
"readonly": false,
"type": "MeterGroupPassThroughType<HTMLAttributes<any>>",
"description": "Used to pass attributes to the label list type's DOM element."
},
{
"name": "label",
"optional": true,
"readonly": false,
"type": "MeterGroupPassThroughType<HTMLAttributes<HTMLSpanElement>>",
"description": "Used to pass attributes to the label's DOM element."
},
{
"name": "metercontainer",
"optional": true,
"readonly": false,
"type": "MeterGroupPassThroughType<HTMLAttributes<HTMLDivElement>>",
"description": "Used to pass attributes to the meter container's DOM element."
},
{
"name": "meter",
"optional": true,
"readonly": false,
"type": "MeterGroupPassThroughType<HTMLAttributes<HTMLDivElement>>",
"description": "Used to pass attributes to the meter's DOM element."
}
],
"callbacks": []
},
"MeterGroupValue": {
"relatedProp": "",
"props": [
{
"name": "value",
"optional": true,
"readonly": false,
"type": "number"
},
{
"name": "label",
"optional": true,
"readonly": false,
"type": "string | HTMLElement"
},
{
"name": "color",
"optional": true,
"readonly": false,
"type": "string"
},
{
"name": "[key: string]",
"optional": false,
"readonly": false,
"type": "any"
}
],
"callbacks": []
},
"CustomRenderProps": {
"relatedProp": "",
"props": [
{
"name": "totaLPercent",
"optional": false,
"readonly": false,
"type": "number"
},
{
"name": "percentages",
"optional": false,
"readonly": false,
"type": "number[]"
},
{
"name": "values",
"optional": false,
"readonly": false,
"type": "MeterGroupValue[]"
}
],
"callbacks": []
}
}
},
"types": {
"description": "Defines the custom types used by the module.",
"values": {
"MeterGroupPassThroughType": {
"values": "PassThroughType<T, MeterGroupPassThroughMethodOptions>"
},
"MeterGroupPassThroughTransitionType": {
"values": "ReactCSSTransitionProps | Function | undefined"
}
}
}
},
"multiselect": {
"description": "MultiSelect is used to select multiple items from a collection.\n\n[Live Demo](https://www.primereact.org/multiselect/)",
"components": {
Expand Down
26 changes: 26 additions & 0 deletions components/doc/metergroup/accessibilitydoc.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
import { DevelopmentSection } from '@/components/doc/common/developmentsection';
import { DocSectionCode } from '@/components/doc/common/docsectioncode';
import { DocSectionText } from '@/components/doc/common/docsectiontext';
import Link from 'next/link';

export function AccessibilityDoc() {
const code = {
basic: `
<span id="dd1">Options</span>
<MultiSelect aria-labelledby="dd1" />
<MultiSelect aria-label="Options" />
`
};

return (
<DocSectionText id="accessibility" label="Accessibility">
<h3>Screen Reader</h3>
<p>
MeterGroup component uses <i>meter</i> role in addition to the <i>aria-valuemin</i>, <i>aria-valuemax</i> and <i>aria-valuenow</i> attributes. Value to describe the component can be defined using <i>aria-labelledby</i> prop.
</p>
<h3>Keyboard Support</h3>
<p>Component does not include any interactive elements.</p>
</DocSectionText>
);
}
55 changes: 55 additions & 0 deletions components/doc/metergroup/basicdoc.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
import { DocSectionCode } from '@/components/doc/common/docsectioncode';
import { DocSectionText } from '@/components/doc/common/docsectiontext';
import { MeterGroup } from '@/components/lib/metergroup/MeterGroup';

export function BasicDoc(props) {
const code = {
basic: `
<MeterGroup values={values} />
`,
javascript: `
import React, { useEffect, useRef } from 'react';
import { MeterGroup } from 'primereact/metergroup';
export default function BasicDemo() {
const values = [{ label: 'Space used', value: 15 }];
return (
<div className="card flex justify-content-center">
<MeterGroup values={values} />
</div>
)
}
`,
typescript: `
import React, { useEffect, useRef } from 'react';
import { MeterGroup } from 'primereact/metergroup';
export default function BasicDemo() {
const values = [{ label: 'Space used', value: 15 }];
return (
<div className="card flex justify-content-center">
<MeterGroup values={values} />
</div>
)
}
`
};

const values = [{ label: 'Space used', value: 15 }];

return (
<>
<DocSectionText {...props}>
<p>
MeterGroup requires a <i>value</i> as the data to display where each item in the collection should be a type of <i>MeterItem</i>.
</p>
</DocSectionText>
<div className="card">
<MeterGroup values={values} />
</div>
<DocSectionCode code={code} />
</>
);
}
Loading

0 comments on commit 3d09917

Please sign in to comment.