Actions are in the top left and right.
\n\n```\n", "With-footer": "Renders a panel with a header and a footer.\n\n```html\nHeader!
\n I have a footer.
\nFooter!
\nHello! I am some virtual popover content!
\n\n \n \n
\n```\n",
"Loading-scrim-panel": "```html\nI'm a panel that is not loading.
\nThis content can have any zIndex and it will not be placed above
\n.
\n.
\n.
\n.
\n\n \n \n
\n```\n"
},
"props": [
{
"name": "intlLoading",
"type": "string",
"mutable": false,
"attr": "intl-loading",
"reflectToAttr": false,
"docs": "Accessible name when the component is loading.",
"docsTags": [
{
"name": "default",
"text": "\"Loading\""
}
],
"default": "TEXT.loading",
"values": [
{
"type": "string"
}
],
"optional": true,
"required": false
},
{
"name": "loading",
"type": "boolean",
"mutable": false,
"attr": "loading",
"reflectToAttr": true,
"docs": "When `true`, a busy indicator is displayed.",
"docsTags": [],
"default": "false",
"values": [
{
"type": "boolean"
}
],
"optional": false,
"required": false
}
],
"methods": [],
"events": [],
"listeners": [],
"styles": [],
"slots": [
{
"name": "",
"docs": "A slot for adding custom content, primarily loading information."
}
],
"parts": [],
"dependents": [
"calcite-block",
"calcite-modal",
"calcite-panel",
"calcite-pick-list",
"calcite-value-list"
],
"dependencies": [
"calcite-loader"
],
"dependencyGraph": {
"calcite-scrim": [
"calcite-loader"
],
"calcite-block": [
"calcite-scrim"
],
"calcite-modal": [
"calcite-scrim"
],
"calcite-panel": [
"calcite-scrim"
],
"calcite-pick-list": [
"calcite-scrim"
],
"calcite-value-list": [
"calcite-scrim"
]
}
},
{
"filePath": "./src/components/select/select.tsx",
"encapsulation": "shadow",
"tag": "calcite-select",
"readme": "# calcite-select\n\nThis component represents a menu of options.\n",
"docs": "This component represents a menu of options.",
"docsTags": [
{
"name": "slot",
"text": "- A slot for adding `calcite-option`s."
}
],
"usage": {
"Basic": "```html\nI'm a panel that is not loading.
\nI have a loading spinner over my content.
\n.
\n.
\n.
\n.
\n\n \n ☕️ \n 🍵 \n 🍻 \n \n \n 🌮 \n 🍔 \n 🌯 \n \n
\n```\n",
"Value": "Specify the underlying value for each option.\n\n```html\nCool thing.
\n\n \n \n
\n Shell Header: My App
\nShell Content
\n \n \n\n \n \n
\n Shell Header: My App
\nShell Content
\n \nPrimary Content
\nNormal tip with a landscape or square image and a small amount of text in the \"info\" slot.
\n Put a link hurr!\n\n Tip description lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut\n labore et dolore magna aliqua.\n
\n\n This is another slotted paragraph. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut\n aliquip ex ea commodo consequat.\n
\nThis tip has an image that is a pretty tall. And the text will run out before the end of the image.
\nIn astronomy, the terms object and body are often used interchangeably.
\nThis tip has an image that is square. And the text will run out before the end of the image.
\nIn astronomy, the terms object and body are often used interchangeably.
\n\n In publishing and graphic design, Lorem ipsum is a placeholder text commonly used to demonstrate the visual form\n of a document without relying on meaningful content (also called greeking). Replacing the actual content with\n placeholder text allows designers to design the form of the content before the content itself has been produced.\n
\nThis tip has no image. As such, the content area will take up the entire width of the tip.
\n\n This is the next paragraph and should show how wide the content area is now. Of course, the width of the overall\n tip will affect things. In astronomy, the terms object and body are often used interchangeably.\n
\n\n Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor\n incididunt ut labore et dolore magna aliqua.\n
\n```\n", "Virtual": "```html\n\n