Packages
noora
0.86.0
0.86.0
0.85.0
0.84.1
0.84.0
0.83.2
0.83.1
0.83.0
0.82.7
0.82.6
0.82.5
0.82.4
0.82.3
0.82.2
0.82.1
0.82.0
0.81.4
0.81.3
0.81.2
0.81.1
0.81.0
0.80.1
0.80.0
0.79.1
0.79.0
0.78.1
0.78.0
0.77.4
0.77.3
0.77.2
0.77.1
0.77.0
0.76.0
0.75.0
0.74.0
0.73.0
0.72.0
0.71.0
0.70.0
0.69.1
0.69.0
0.68.0
0.67.0
0.66.0
0.65.0
0.64.2
0.64.1
0.64.0
0.63.2
0.63.1
0.63.0
0.62.0
0.61.0
0.60.0
0.59.0
0.58.0
0.57.0
0.56.1
0.56.0
0.55.0
0.54.0
0.53.1
0.53.0
0.52.1
0.52.0
0.51.0
0.50.1
0.50.0
0.49.0
0.48.0
0.47.0
0.46.0
0.45.0
0.44.3
0.44.2
0.44.1
0.44.0
0.43.0
0.42.0
0.41.0
0.40.6
0.40.5
0.40.4
0.40.3
0.40.2
0.40.1
0.40.0
0.39.1
0.39.0
0.38.0
0.37.0
0.36.0
0.35.0
0.34.0
0.33.0
0.32.1
0.32.0
0.31.0
0.30.0
0.29.2
0.29.1
0.29.0
0.28.5
0.28.4
0.28.3
0.28.2
0.28.1
0.28.0
0.27.0
0.26.1
0.26.0
0.25.0
0.24.0
0.23.1
0.23.0
0.22.1
0.22.0
0.21.0
0.20.0
0.19.0
0.18.0
0.17.0
0.16.0
0.15.0
0.14.0
0.13.0
0.12.1
0.12.0
0.11.2
0.11.1
0.11.0
0.10.0
0.9.0
0.8.0
0.7.0
0.6.1
0.6.0
0.5.1
0.5.0
0.4.0
0.3.2
0.3.1
0.3.0
0.2.2
0.2.0
0.1.0
0.1.0-rc.2
0.1.0-rc.1
0.1.0-alpha.6
0.1.0-alpha.5
0.1.0-alpha.4
0.1.0-alpha.3
0.1.0-alpha.2
0.1.0-alpha.1
A component library for Phoenix LiveView applications
Current section
Files
Jump to
Current section
Files
components/button-group-item.json
{
"name": "ButtonGroupItem",
"tagName": "noora-button-group-item",
"elementClassName": "NooraButtonGroupItem",
"className": "noora-button-group-item",
"modulePath": "./priv/static/noora-web-components.js",
"description": "Describes one declarative control inside a button group.",
"usage": "<noora-button-group-item value=\"day\">Day</noora-button-group-item>",
"standalone": false,
"attributes": [
{
"name": "label",
"property": "label",
"type": "string",
"default": "",
"description": "Sets the item label instead of using text content."
},
{
"name": "value",
"property": "value",
"type": "string",
"description": "Sets the value emitted when the item is selected."
},
{
"name": "href",
"property": "href",
"type": "string",
"description": "Renders the item as a link."
},
{
"name": "icon",
"property": "icon",
"type": "string",
"description": "Sets the icon for an icon-only item."
},
{
"name": "icon-left",
"property": "iconLeft",
"type": "string",
"description": "Shows an icon before the label."
},
{
"name": "icon-right",
"property": "iconRight",
"type": "string",
"description": "Shows an icon after the label."
},
{
"name": "icon-only",
"property": "iconOnly",
"type": "boolean",
"default": false,
"description": "Uses the icon as the complete item content."
},
{
"name": "aria-label",
"property": "ariaLabel",
"type": "string",
"description": "Provides an accessible label for an icon-only item."
},
{
"name": "disabled",
"property": "disabled",
"type": "boolean",
"default": false,
"description": "Disables the item."
},
{
"name": "selected",
"property": "selected",
"type": "boolean",
"default": false,
"description": "Shows the item in its selected state."
}
],
"properties": [],
"readonlyProperties": [],
"slots": [
{
"name": "",
"description": "The item label."
}
],
"cssParts": [],
"notes": ["Use this element inside noora-button-group."],
"examples": [
{
"id": "item",
"title": "Item",
"description": "Describe one button-group control.",
"markup": "<noora-button-group-item value=\"day\">Day</noora-button-group-item>"
}
]
}