[ { "id": "oj-c.RatingGauge", "name": "RatingGauge", "memberof": "oj-c", "kind": "class", "meta": { "filename": "rating-gauge.tsx", "path": "web/components/oj-c/rating-gauge" }, "ojcomponent": true, "isvcomponent": true, "since": "13.0.0", "longname": "oj-c.RatingGauge", "pack": "oj-c", "classdesc": "

\n JET Rating Gauge\n \n

\nRating gauges are typically used to display or accept user feedback on a product or service.\n
<oj-c-rating-gauge value='4'></oj-c-rating-gauge>
\n\n

\n Accessibility\n \n

\n

\nThe application is required to set one of the following attributes on the element with meaningful descriptors as the rating-gauge element does not provide a default descriptor.\n

\n\n\n

\nIf the application is using readonly, thresholds or reference lines to provide additional context, they need to include such information for screen readers using either of the following methods:\n

\n

\n\n

\nDisabled content: JET supports an accessible luminosity contrast ratio,\nas specified in WCAG 2.0 - Section 1.4.3 \"Contrast\",\nin the themes that are accessible. (See the \"Theming\" chapter of the JET Developer Guide for more information on which\nthemes are accessible.) Note that Section 1.4.3 says that text or images of text that are part of an inactive user\ninterface component have no contrast requirement. Because disabled content may not meet the minimum contrast ratio\nrequired of enabled content, it cannot be used to convey meaningful information.\n

\n\n

\n Keyboard\n \n

\n\n\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
KeyAction
EnterSubmit the current value of the gauge.
TabMove focus to next element and submit the current value of the gauge.
Shift + TabMove focus to previous element.
EndIncrease the gauge's transient value to max value. Value is set after using Enter or Tab to submit.
HomeDecrease the gauge's transient value to zero. Value is set after using Enter or Tab to submit.
LeftArrowDecrease the gauge's transient value in left-to-right locales. Increase the gauge's transient value in right-to-left locales. Value is set after using Enter or Tab to submit.
RightArrowIncrease the gauge's transient value in left-to-right locales. Decrease the gauge's transient value in right-to-left locales. Value is set after using Enter or Tab to submit.
\n\n

\nTouch End User Information\n \n

\n\n\n \n \n \n \n \n \n \n \n \n \n \n \n
GestureAction
DragValue change when readonly or disabled is false.
\n
", "scope": "static", "tagWithoutBrackets": "oj-c-rating-gauge", "tagWithBrackets": "", "domInterface": "CRatingGaugeElement", "ojPageTitle": "<oj-c-rating-gauge>", "camelCaseName": "RatingGauge", "ojPageTitlePrefix": "Element: ", "ojtsvcomponent": true, "tstype": { "target": "Type", "value": "interface CRatingGaugeElement extends JetElement" }, "ojsignature": [ { "target": "Type", "value": "interface CRatingGaugeElement extends JetElement" } ], "tsdeprecated": [ { "type": "supersedes", "since": "15.0.0", "value": [ "oj-rating-gauge" ] } ], "extension": { "catalog": { "category": "Visualizations" }, "vbdt": { "module": "oj-c/rating-gauge" }, "oracle": { "icon": "oj-ux-ico-gauge-rating", "uxSpecs": [ "gauge" ] } }, "ojmodule": "rating-gauge" }, { "id": "oj-c.RatingGauge#max", "name": "max", "memberof": "oj-c.RatingGauge", "meta": { "filename": "rating-gauge.tsx", "path": "web/components/oj-c/rating-gauge" }, "kind": "member", "longname": "oj-c.RatingGauge#max", "scope": "instance", "type": { "names": [ "number" ] }, "optional": true, "ojdisplayname": "Max", "ojshortdesc": "The maximum value of the gauge.", "description": "Integer value specifying the maximum value of the gauge, which determines the number of items that are displayed.", "defaultvalue": 5 }, { "id": "oj-c.RatingGauge#readonly", "name": "readonly", "memberof": "oj-c.RatingGauge", "meta": { "filename": "rating-gauge.tsx", "path": "web/components/oj-c/rating-gauge" }, "kind": "member", "longname": "oj-c.RatingGauge#readonly", "scope": "instance", "type": { "names": [ "boolean" ] }, "optional": true, "ojdisplayname": "Readonly", "description": "Defines whether the value of the gauge can be changed by the end user.", "defaultvalue": false }, { "id": "oj-c.RatingGauge#disabled", "name": "disabled", "memberof": "oj-c.RatingGauge", "meta": { "filename": "rating-gauge.tsx", "path": "web/components/oj-c/rating-gauge" }, "kind": "member", "longname": "oj-c.RatingGauge#disabled", "scope": "instance", "type": { "names": [ "boolean" ] }, "optional": true, "ojdisplayname": "Disabled", "description": "Defines whether the gauge is disabled or not. User interaction is prevented and the rating gauge is hidden from screen readers if set to true.", "defaultvalue": false }, { "id": "oj-c.RatingGauge#changed", "name": "changed", "memberof": "oj-c.RatingGauge", "meta": { "filename": "rating-gauge.tsx", "path": "web/components/oj-c/rating-gauge" }, "kind": "member", "longname": "oj-c.RatingGauge#changed", "scope": "instance", "type": { "names": [ "boolean" ] }, "optional": true, "ojdisplayname": "Changed", "ojwriteback": true, "ojshortdesc": "Whether there has been a value entered by the user even if it is the same as the initial value.", "description": "Whether there has been a value entered by the user even if it is the same as the initial value.", "defaultvalue": false }, { "id": "oj-c.RatingGauge#value", "name": "value", "memberof": "oj-c.RatingGauge", "meta": { "filename": "rating-gauge.tsx", "path": "web/components/oj-c/rating-gauge" }, "kind": "member", "longname": "oj-c.RatingGauge#value", "scope": "instance", "type": { "names": [ "number|null" ] }, "optional": true, "ojdisplayname": "Value", "ojwriteback": true, "ojshortdesc": "The value of the Rating Gauge.", "description": "The value of the Rating Gauge. The element's value attribute is used if it\nis provided, otherwise the default value of 0 is used.\nAny other negative value will default to 0.", "defaultvalue": 0 }, { "id": "oj-c.RatingGauge#step", "name": "step", "memberof": "oj-c.RatingGauge", "meta": { "filename": "rating-gauge.tsx", "path": "web/components/oj-c/rating-gauge" }, "kind": "member", "longname": "oj-c.RatingGauge#step", "scope": "instance", "type": { "names": [ "number" ] }, "optional": true, "ojdisplayname": "Step", "description": "Specifies the increment by which values can be changed by the end user.", "defaultvalue": 1 }, { "id": "oj-c.RatingGauge#describedBy", "name": "describedBy", "memberof": "oj-c.RatingGauge", "meta": { "filename": "rating-gauge.tsx", "path": "web/components/oj-c/rating-gauge" }, "kind": "member", "longname": "oj-c.RatingGauge#describedBy", "scope": "instance", "type": { "names": [ "string|null" ] }, "optional": true, "ojdisplayname": "Described By", "description": "Used to establish a relationship between this component and another element.\nA common use is to tie a label, which can be a text in a div or some other HTML element, and the oj-c-rating-gauge together for accessibility.\nThe oj-label element has a label-id, which is used by the described-by attribute to tie the two components together to facilitate correct screen reader behavior." }, { "id": "oj-c.RatingGauge#labelledBy", "name": "labelledBy", "memberof": "oj-c.RatingGauge", "meta": { "filename": "rating-gauge.tsx", "path": "web/components/oj-c/rating-gauge" }, "kind": "member", "longname": "oj-c.RatingGauge#labelledBy", "scope": "instance", "type": { "names": [ "string|null" ] }, "optional": true, "ojdisplayname": "Labelled By", "description": "Used to establish a relationship between this component and another element.\nA common use is to tie a label, which can be a text in a div or some other HTML element, and the oj-c-rating-gauge together for accessibility.\nThe oj-label element has a label-id, which is used by the labelled-by attribute to tie the two components together to facilitate correct screen reader behavior." }, { "id": "oj-c.RatingGauge#size", "name": "size", "memberof": "oj-c.RatingGauge", "meta": { "filename": "rating-gauge.tsx", "path": "web/components/oj-c/rating-gauge" }, "kind": "member", "longname": "oj-c.RatingGauge#size", "scope": "instance", "type": { "names": [ "\"sm\"", "\"md\"", "\"lg\"" ] }, "optional": true, "ojdisplayname": "Size", "ojshortdesc": "Specifies the size of the rating gauge items.", "description": "Specifies the size of the individual rating gauge items.", "ojvalues": [ { "name": "sm", "description": "small Rating Gauge", "displayName": "Small", "type": { "names": [ "string" ] } }, { "name": "md", "description": "medium Rating Gauge (default, if unspecified)", "displayName": "Medium", "type": { "names": [ "string" ] } }, { "name": "lg", "description": "large Rating Gauge", "displayName": "Large", "type": { "names": [ "string" ] } } ], "ojvalueskeeporder": true, "defaultvalue": "'md'" }, { "id": "oj-c.RatingGauge#color", "name": "color", "memberof": "oj-c.RatingGauge", "meta": { "filename": "rating-gauge.tsx", "path": "web/components/oj-c/rating-gauge" }, "kind": "member", "longname": "oj-c.RatingGauge#color", "scope": "instance", "type": { "names": [ "\"gold\"", "\"neutral\"" ] }, "optional": true, "ojdisplayname": "Color", "ojshortdesc": "Specifies the color of the rating gauge items.", "description": "Specifies the color of the individual rating gauge items.", "ojvalues": [ { "name": "neutral", "description": "neutral color Rating Gauge (default, if unspecified)", "displayName": "Neutral", "type": { "names": [ "string" ] } }, { "name": "gold", "description": "gold color Rating Gauge", "displayName": "Gold", "type": { "names": [ "string" ] } } ], "ojvalueskeeporder": true, "defaultvalue": "'neutral'" }, { "id": "oj-c.RatingGauge#thresholds", "name": "thresholds", "memberof": "oj-c.RatingGauge", "meta": { "filename": "rating-gauge.tsx", "path": "web/components/oj-c/rating-gauge" }, "kind": "member", "longname": "oj-c.RatingGauge#thresholds", "scope": "instance", "type": { "names": [ "Array" ] }, "optional": true, "ojdisplayname": "Thresholds", "description": "An array of objects defining the thresholds for the rating gauge.", "tstype": [ { "target": "Type", "value": "Array", "jsdocOverride": true } ] }, { "id": "oj-c.RatingGauge#datatip", "name": "datatip", "memberof": "oj-c.RatingGauge", "meta": { "filename": "rating-gauge.tsx", "path": "web/components/oj-c/rating-gauge" }, "kind": "member", "longname": "oj-c.RatingGauge#datatip", "scope": "instance", "type": { "names": [ "function" ] }, "optional": true, "ojdisplayname": "Datatip", "description": "The rating gauge datatip string. Datatip is only used for interactive rating gauges.", "tstype": [ { "target": "Type", "value": "(context: oj-c.RatingGauge.DatatipContext) => string", "jsdocOverride": true } ] }, { "id": "oj-c.RatingGauge#tooltip", "name": "tooltip", "memberof": "oj-c.RatingGauge", "meta": { "filename": "rating-gauge.tsx", "path": "web/components/oj-c/rating-gauge" }, "kind": "member", "longname": "oj-c.RatingGauge#tooltip", "scope": "instance", "type": { "names": [ "string" ] }, "optional": true, "ojdisplayname": "Tooltip", "description": "The rating gauge tooltip. Tooltip is only used for read only rating gauges. If aria-label is not specified, tooltip will be used as the aria-label." }, { "id": "oj-c.RatingGauge#transientValue", "name": "transientValue", "memberof": "oj-c.RatingGauge", "meta": { "filename": "rating-gauge.tsx", "path": "web/components/oj-c/rating-gauge" }, "kind": "member", "longname": "oj-c.RatingGauge#transientValue", "scope": "instance", "type": { "names": [ "number" ] }, "optional": true, "ojdisplayname": "transientValue", "ojwriteback": true, "readonly": true, "description": "A read-only property for retrieving the transient value from the rating gauge. It is updated upon user gestures that cause transient value changes, such as hovering over the rating gauge." }, { "id": "oj-c.RatingGauge#setProperty", "name": "setProperty", "memberof": "oj-c.RatingGauge", "meta": { "filename": "rating-gauge.tsx", "path": "web/components/oj-c/rating-gauge" }, "kind": "function", "longname": "oj-c.RatingGauge#setProperty", "scope": "instance", "returns": [ { "type": { "names": [ "void" ] } } ], "ojshortdesc": "Sets a property or a single subproperty for complex properties and notifies the component of the change, triggering a corresponding event.", "description": "Sets a property or a single subproperty for complex properties and notifies the component of the change, triggering a corresponding event.", "params": [ { "name": "property", "description": "The property name to set. Supports dot notation for subproperty access.", "type": { "names": [ "string" ] } }, { "name": "value", "description": "The new value to set the property to.", "type": { "names": [ "any" ] } } ] }, { "id": "oj-c.RatingGauge#getProperty", "name": "getProperty", "memberof": "oj-c.RatingGauge", "meta": { "filename": "rating-gauge.tsx", "path": "web/components/oj-c/rating-gauge" }, "kind": "function", "longname": "oj-c.RatingGauge#getProperty", "scope": "instance", "returns": [ { "type": { "names": [ "any" ] } } ], "ojshortdesc": "Retrieves the value of a property or a subproperty.", "description": "Retrieves the value of a property or a subproperty.", "params": [ { "name": "property", "description": "The property name to get. Supports dot notation for subproperty access.", "type": { "names": [ "string" ] } } ] }, { "id": "oj-c.RatingGauge#setProperties", "name": "setProperties", "memberof": "oj-c.RatingGauge", "meta": { "filename": "rating-gauge.tsx", "path": "web/components/oj-c/rating-gauge" }, "kind": "function", "longname": "oj-c.RatingGauge#setProperties", "scope": "instance", "returns": [ { "type": { "names": [ "void" ] } } ], "ojshortdesc": "Performs a batch set of properties.", "description": "Performs a batch set of properties.", "params": [ { "name": "properties", "description": "An object containing the property and value pairs to set.", "type": { "names": [ "object" ] } } ] }, { "id": "oj-c.RatingGauge.touchDoc", "name": "touchDoc", "kind": "member", "longname": "oj-c.RatingGauge.touchDoc", "description": "\n \n \n \n \n \n \n \n \n \n \n \n \n
GestureAction
DragValue change when readonly or disabled is false.
", "memberof": "oj-c.RatingGauge", "meta": { "filename": "rating-gauge.tsx", "path": "web/components/oj-c/rating-gauge" }, "ojfragment": true }, { "id": "oj-c.RatingGauge.Threshold", "name": "Threshold", "kind": "typedef", "memberof": "oj-c.RatingGauge", "meta": { "filename": "rating-gauge.tsx", "path": "web/components/oj-c/rating-gauge" }, "longname": "oj-c.RatingGauge.Threshold", "type": { "names": [ "Object" ] }, "scope": "static", "description": "", "properties": [ { "name": "accessibleLabel", "description": "A label for the threshold used for accessibility purposes.", "optional": true, "type": { "names": [ "string" ] } }, { "name": "color", "description": "

The color of the threshold.

\n

In addition to standard CSS color values, special enumerated values 'danger', 'warning',\nand 'success' are also supported. These special values are mapped to corresponding CSS color values\nbased upon the current theme.

", "optional": true, "type": { "names": [ "\"danger\"|\"warning\"|\"success\"|string" ] }, "tstype": [ { "target": "Type", "value": "\"danger\"|\"warning\"|\"success\"|string", "jsdocOverride": true } ], "ojvalues": [ { "name": "danger", "description": "Maps to theme-specific color indicating a danger condition", "type": { "names": [ "string" ] } }, { "name": "warning", "description": "Maps to theme-specific color indicating a warning condition", "type": { "names": [ "string" ] } }, { "name": "success", "description": "Maps to theme-specific color indicating a success condition", "type": { "names": [ "string" ] } } ], "ojvalueskeeporder": true }, { "name": "max", "description": "The maximum value of the threshold.", "optional": false, "type": { "names": [ "number" ] } } ] }, { "id": "oj-c.RatingGauge.DatatipContext", "name": "DatatipContext", "kind": "typedef", "memberof": "oj-c.RatingGauge", "meta": { "filename": "rating-gauge.tsx", "path": "web/components/oj-c/rating-gauge" }, "longname": "oj-c.RatingGauge.DatatipContext", "type": { "names": [ "Object" ] }, "scope": "static", "description": "Context for datatip function.", "properties": [ { "name": "value", "description": "The value of the currently active rating gauge item.", "optional": false, "type": { "names": [ "number" ] } } ] } ]