release: complete UI component catalog 0.2.58
This commit is contained in:
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/ai",
|
"name": "@wrnexus/ai",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "Zero-dependency Claude (Anthropic) client for WrNexus apps.",
|
"description": "Zero-dependency Claude (Anthropic) client for WrNexus apps.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/authz",
|
"name": "@wrnexus/authz",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "@wrnexus/authz — part of the WrNexus framework.",
|
"description": "@wrnexus/authz — part of the WrNexus framework.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
|
|||||||
+11
-11
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/cli",
|
"name": "@wrnexus/cli",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "@wrnexus/cli — part of the WrNexus framework.",
|
"description": "@wrnexus/cli — part of the WrNexus framework.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@@ -28,16 +28,16 @@
|
|||||||
"wrnexus": "./dist/index.js"
|
"wrnexus": "./dist/index.js"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@wrnexus/core": "^0.2.57",
|
"@wrnexus/core": "^0.2.58",
|
||||||
"@wrnexus/router": "^0.2.57",
|
"@wrnexus/router": "^0.2.58",
|
||||||
"@wrnexus/csr": "^0.2.57",
|
"@wrnexus/csr": "^0.2.58",
|
||||||
"@wrnexus/compiler": "^0.2.57",
|
"@wrnexus/compiler": "^0.2.58",
|
||||||
"@wrnexus/styles": "^0.2.57",
|
"@wrnexus/styles": "^0.2.58",
|
||||||
"@wrnexus/dev-server": "^0.2.57",
|
"@wrnexus/dev-server": "^0.2.58",
|
||||||
"@wrnexus/ui": "^0.2.57",
|
"@wrnexus/ui": "^0.2.58",
|
||||||
"@wrnexus/validation": "^0.2.57",
|
"@wrnexus/validation": "^0.2.58",
|
||||||
"@wrnexus/i18n": "^0.2.57",
|
"@wrnexus/i18n": "^0.2.58",
|
||||||
"@wrnexus/db": "^0.2.57"
|
"@wrnexus/db": "^0.2.58"
|
||||||
},
|
},
|
||||||
"files": [
|
"files": [
|
||||||
"dist"
|
"dist"
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/compiler",
|
"name": "@wrnexus/compiler",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "@wrnexus/compiler — part of the WrNexus framework.",
|
"description": "@wrnexus/compiler — part of the WrNexus framework.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/core",
|
"name": "@wrnexus/core",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "@wrnexus/core — part of the WrNexus framework.",
|
"description": "@wrnexus/core — part of the WrNexus framework.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/csr",
|
"name": "@wrnexus/csr",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "@wrnexus/csr — part of the WrNexus framework.",
|
"description": "@wrnexus/csr — part of the WrNexus framework.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@@ -21,7 +21,7 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@wrnexus/core": "^0.2.57"
|
"@wrnexus/core": "^0.2.58"
|
||||||
},
|
},
|
||||||
"files": [
|
"files": [
|
||||||
"dist"
|
"dist"
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/db",
|
"name": "@wrnexus/db",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "@wrnexus/db — part of the WrNexus framework.",
|
"description": "@wrnexus/db — part of the WrNexus framework.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/dev-server",
|
"name": "@wrnexus/dev-server",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "@wrnexus/dev-server — part of the WrNexus framework.",
|
"description": "@wrnexus/dev-server — part of the WrNexus framework.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@@ -25,18 +25,18 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@wrnexus/core": "^0.2.57",
|
"@wrnexus/core": "^0.2.58",
|
||||||
"@wrnexus/router": "^0.2.57",
|
"@wrnexus/router": "^0.2.58",
|
||||||
"@wrnexus/ssr": "^0.2.57",
|
"@wrnexus/ssr": "^0.2.58",
|
||||||
"@wrnexus/csr": "^0.2.57",
|
"@wrnexus/csr": "^0.2.58",
|
||||||
"@wrnexus/compiler": "^0.2.57",
|
"@wrnexus/compiler": "^0.2.58",
|
||||||
"@wrnexus/styles": "^0.2.57",
|
"@wrnexus/styles": "^0.2.58",
|
||||||
"@wrnexus/ui": "^0.2.57",
|
"@wrnexus/ui": "^0.2.58",
|
||||||
"@wrnexus/validation": "^0.2.57",
|
"@wrnexus/validation": "^0.2.58",
|
||||||
"@wrnexus/i18n": "^0.2.57",
|
"@wrnexus/i18n": "^0.2.58",
|
||||||
"@wrnexus/db": "^0.2.57",
|
"@wrnexus/db": "^0.2.58",
|
||||||
"@wrnexus/pubsub": "^0.2.57",
|
"@wrnexus/pubsub": "^0.2.58",
|
||||||
"@wrnexus/uploader": "^0.2.57"
|
"@wrnexus/uploader": "^0.2.58"
|
||||||
},
|
},
|
||||||
"files": [
|
"files": [
|
||||||
"dist"
|
"dist"
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/encryption",
|
"name": "@wrnexus/encryption",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "@wrnexus/encryption — part of the WrNexus framework.",
|
"description": "@wrnexus/encryption — part of the WrNexus framework.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/helpers",
|
"name": "@wrnexus/helpers",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "Safe convenience helpers for WrNexus request contexts and common application flows.",
|
"description": "Safe convenience helpers for WrNexus request contexts and common application flows.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@@ -21,7 +21,7 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@wrnexus/core": "^0.2.57"
|
"@wrnexus/core": "^0.2.58"
|
||||||
},
|
},
|
||||||
"files": [
|
"files": [
|
||||||
"dist"
|
"dist"
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/i18n",
|
"name": "@wrnexus/i18n",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "@wrnexus/i18n — part of the WrNexus framework.",
|
"description": "@wrnexus/i18n — part of the WrNexus framework.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@@ -21,7 +21,7 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@wrnexus/core": "^0.2.57"
|
"@wrnexus/core": "^0.2.58"
|
||||||
},
|
},
|
||||||
"files": [
|
"files": [
|
||||||
"dist"
|
"dist"
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/jwt",
|
"name": "@wrnexus/jwt",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "@wrnexus/jwt — part of the WrNexus framework.",
|
"description": "@wrnexus/jwt — part of the WrNexus framework.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/mobile",
|
"name": "@wrnexus/mobile",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "@wrnexus/mobile — part of the WrNexus framework.",
|
"description": "@wrnexus/mobile — part of the WrNexus framework.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@@ -21,7 +21,7 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@wrnexus/native": "^0.2.57"
|
"@wrnexus/native": "^0.2.58"
|
||||||
},
|
},
|
||||||
"files": [
|
"files": [
|
||||||
"dist"
|
"dist"
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/native",
|
"name": "@wrnexus/native",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "@wrnexus/native — part of the WrNexus framework.",
|
"description": "@wrnexus/native — part of the WrNexus framework.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/oauth",
|
"name": "@wrnexus/oauth",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "@wrnexus/oauth — part of the WrNexus framework.",
|
"description": "@wrnexus/oauth — part of the WrNexus framework.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/pubsub",
|
"name": "@wrnexus/pubsub",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "@wrnexus/pubsub — part of the WrNexus framework.",
|
"description": "@wrnexus/pubsub — part of the WrNexus framework.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/queue",
|
"name": "@wrnexus/queue",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "@wrnexus/queue — part of the WrNexus framework.",
|
"description": "@wrnexus/queue — part of the WrNexus framework.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/reactive",
|
"name": "@wrnexus/reactive",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "@wrnexus/reactive — part of the WrNexus framework.",
|
"description": "@wrnexus/reactive — part of the WrNexus framework.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/router",
|
"name": "@wrnexus/router",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "@wrnexus/router — part of the WrNexus framework.",
|
"description": "@wrnexus/router — part of the WrNexus framework.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@@ -21,8 +21,8 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@wrnexus/compiler": "^0.2.57",
|
"@wrnexus/compiler": "^0.2.58",
|
||||||
"@wrnexus/core": "^0.2.57"
|
"@wrnexus/core": "^0.2.58"
|
||||||
},
|
},
|
||||||
"files": [
|
"files": [
|
||||||
"dist"
|
"dist"
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/ssr",
|
"name": "@wrnexus/ssr",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "@wrnexus/ssr — part of the WrNexus framework.",
|
"description": "@wrnexus/ssr — part of the WrNexus framework.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@@ -21,7 +21,7 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@wrnexus/core": "^0.2.57"
|
"@wrnexus/core": "^0.2.58"
|
||||||
},
|
},
|
||||||
"files": [
|
"files": [
|
||||||
"dist"
|
"dist"
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/styles",
|
"name": "@wrnexus/styles",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "@wrnexus/styles — part of the WrNexus framework.",
|
"description": "@wrnexus/styles — part of the WrNexus framework.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@@ -21,7 +21,7 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@wrnexus/uploader": "^0.2.57"
|
"@wrnexus/uploader": "^0.2.58"
|
||||||
},
|
},
|
||||||
"files": [
|
"files": [
|
||||||
"dist"
|
"dist"
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/test",
|
"name": "@wrnexus/test",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "@wrnexus/test — part of the WrNexus framework.",
|
"description": "@wrnexus/test — part of the WrNexus framework.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@wrnexus/tracking",
|
"name": "@wrnexus/tracking",
|
||||||
"version": "0.2.57",
|
"version": "0.2.58",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"description": "@wrnexus/tracking — part of the WrNexus framework.",
|
"description": "@wrnexus/tracking — part of the WrNexus framework.",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
@@ -15,6 +15,11 @@ driven by `var(--wire-*)` theme tokens, so components restyle instantly when the
|
|||||||
theme changes. The tiny JS surface (`src/index.ts`) exists only so the toolchain
|
theme changes. The tiny JS surface (`src/index.ts`) exists only so the toolchain
|
||||||
(CLI build + dev server) can locate the component directory and stylesheet.
|
(CLI build + dev server) can locate the component directory and stylesheet.
|
||||||
|
|
||||||
|
The complete PDF-aligned catalog currently contains **891 components**. The
|
||||||
|
generated `COMPONENTS.md` and `component-reference.json` files document every
|
||||||
|
mount name, prop, inferred type, default/required status, slot, event, category,
|
||||||
|
and source file directly from the packaged `.wrn` source.
|
||||||
|
|
||||||
## Installation
|
## Installation
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
@@ -81,6 +86,9 @@ metadata is emitted in `<head>` instead of invalid component markup.
|
|||||||
The authoritative, always-current list is `uiComponentNames()` (below), which reads
|
The authoritative, always-current list is `uiComponentNames()` (below), which reads
|
||||||
the component directory at runtime.
|
the component directory at runtime.
|
||||||
|
|
||||||
|
For the full catalog, see [`COMPONENTS.md`](./COMPONENTS.md). The machine-readable
|
||||||
|
equivalent is exported as `@wrnexus/ui/component-reference.json`.
|
||||||
|
|
||||||
## API
|
## API
|
||||||
|
|
||||||
The JS module (`@wrnexus/ui`) exposes four helpers used by the build tooling to
|
The JS module (`@wrnexus/ui`) exposes four helpers used by the build tooling to
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,11 @@
|
|||||||
|
component AcceptAllCookiesButton {
|
||||||
|
props {
|
||||||
|
label = "Action"
|
||||||
|
href = ""
|
||||||
|
type = "button"
|
||||||
|
variant = "primary"
|
||||||
|
disabled = false
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <span class="wire-catalog-action {class}"><a data-show="href" href="{href}" class="wire-btn wire-btn--{variant}">{label}<slot /></a><button data-show="!href" type="{type}" disabled="{disabled}" class="wire-btn wire-btn--{variant}">{label}<slot /></button></span> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component AccessibleAccordion {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component AccessibleCarousel {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component AccessibleChartSummary {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
component AccessibleDialog {
|
||||||
|
props {
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
open = false
|
||||||
|
closeLabel = "Close"
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <div data-show="open" class="wire-overlay wire-catalog-overlay {class}"><section role="dialog" aria-modal="true" aria-label="{title}" class="wire-dialog"><header><h2 data-show="title" class="wire-dialog__title">{title}</h2><p data-show="description" class="wire-dialog__description">{description}</p></header><slot /><button type="button" class="wire-btn wire-btn--ghost">{closeLabel}</button></section></div> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component AccessibleErrorSummary {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component AccessibleIcon {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
component AccessibleMenu {
|
||||||
|
props {
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
open = false
|
||||||
|
closeLabel = "Close"
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <div data-show="open" class="wire-overlay wire-catalog-overlay {class}"><section role="dialog" aria-modal="true" aria-label="{title}" class="wire-dialog"><header><h2 data-show="title" class="wire-dialog__title">{title}</h2><p data-show="description" class="wire-dialog__description">{description}</p></header><slot /><button type="button" class="wire-btn wire-btn--ghost">{closeLabel}</button></section></div> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component AccessibleTabs {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component AccessibleTooltip {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
component AccountMenu {
|
||||||
|
props {
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
open = false
|
||||||
|
closeLabel = "Close"
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <div data-show="open" class="wire-overlay wire-catalog-overlay {class}"><section role="dialog" aria-modal="true" aria-label="{title}" class="wire-dialog"><header><h2 data-show="title" class="wire-dialog__title">{title}</h2><p data-show="description" class="wire-dialog__description">{description}</p></header><slot /><button type="button" class="wire-btn wire-btn--ghost">{closeLabel}</button></section></div> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,11 @@
|
|||||||
|
component AccountStatusBanner {
|
||||||
|
props {
|
||||||
|
label = "AccountStatus"
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
value = ""
|
||||||
|
variant = "default"
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <aside role="status" class="wire-alert wire-alert--{variant} wire-catalog-feedback {class}"><strong data-show="title || label">{title || label}</strong><span data-show="value" class="wire-badge wire-badge--{variant}">{value}</span><p data-show="description">{description}</p><slot /></aside> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
component ActionMenu {
|
||||||
|
props {
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
open = false
|
||||||
|
closeLabel = "Close"
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <div data-show="open" class="wire-overlay wire-catalog-overlay {class}"><section role="dialog" aria-modal="true" aria-label="{title}" class="wire-dialog"><header><h2 data-show="title" class="wire-dialog__title">{title}</h2><p data-show="description" class="wire-dialog__description">{description}</p></header><slot /><button type="button" class="wire-btn wire-btn--ghost">{closeLabel}</button></section></div> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
component ActiveFilterList {
|
||||||
|
props {
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
empty = false
|
||||||
|
emptyText = "No items available."
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <section class="wire-catalog-collection {class}"><header data-show="title || description"><h2 data-show="title">{title}</h2><p data-show="description">{description}</p></header><div data-show="!empty" role="list" class="wire-catalog-collection__items"><slot /></div><p data-show="empty" role="status" class="wire-muted">{emptyText}</p></section> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
component ActivityList {
|
||||||
|
props {
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
empty = false
|
||||||
|
emptyText = "No items available."
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <section class="wire-catalog-collection {class}"><header data-show="title || description"><h2 data-show="title">{title}</h2><p data-show="description">{description}</p></header><div data-show="!empty" role="list" class="wire-catalog-collection__items"><slot /></div><p data-show="empty" role="status" class="wire-muted">{emptyText}</p></section> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component AddOnCard {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
component AddressInput {
|
||||||
|
props {
|
||||||
|
label = "Address"
|
||||||
|
name = ""
|
||||||
|
value = ""
|
||||||
|
placeholder = ""
|
||||||
|
type = "text"
|
||||||
|
required = false
|
||||||
|
disabled = false
|
||||||
|
readonly = false
|
||||||
|
help = ""
|
||||||
|
error = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <label class="wire-field wire-catalog-field {class}"><span class="wire-label">{label}<span data-show="required" class="wire-required"> *</span></span><input name="{name}" value="{value}" placeholder="{placeholder}" type="{type}" required="{required}" disabled="{disabled}" readonly="{readonly}" aria-invalid="{error ? 'true' : 'false'}" class="wire-input" /><span data-show="help && !error" class="wire-field-message wire-field-message--help">{help}</span><span data-show="error" role="alert" class="wire-field-message wire-field-message--error">{error}</span><slot /></label> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component AddressPreview {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component AdvancedFilterBuilder {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
component AlertDialog {
|
||||||
|
props {
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
open = false
|
||||||
|
closeLabel = "Close"
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <div data-show="open" class="wire-overlay wire-catalog-overlay {class}"><section role="dialog" aria-modal="true" aria-label="{title}" class="wire-dialog"><header><h2 data-show="title" class="wire-dialog__title">{title}</h2><p data-show="description" class="wire-dialog__description">{description}</p></header><slot /><button type="button" class="wire-btn wire-btn--ghost">{closeLabel}</button></section></div> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
component AmountInput {
|
||||||
|
props {
|
||||||
|
label = "Amount"
|
||||||
|
name = ""
|
||||||
|
value = ""
|
||||||
|
placeholder = ""
|
||||||
|
type = "text"
|
||||||
|
required = false
|
||||||
|
disabled = false
|
||||||
|
readonly = false
|
||||||
|
help = ""
|
||||||
|
error = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <label class="wire-field wire-catalog-field {class}"><span class="wire-label">{label}<span data-show="required" class="wire-required"> *</span></span><input name="{name}" value="{value}" placeholder="{placeholder}" type="{type}" required="{required}" disabled="{disabled}" readonly="{readonly}" aria-invalid="{error ? 'true' : 'false'}" class="wire-input" /><span data-show="help && !error" class="wire-field-message wire-field-message--help">{help}</span><span data-show="error" role="alert" class="wire-field-message wire-field-message--error">{error}</span><slot /></label> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component AnalyticsDashboardPreview {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
component AnchorNavigation {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
align = "start"
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <section class="wire-catalog-section wire-text--{align} {class}"><header data-show="eyebrow || title || description"><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h2 data-show="title">{title}</h2><p data-show="description" class="wire-muted">{description}</p></header><slot /></section> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
component ApartmentInput {
|
||||||
|
props {
|
||||||
|
label = "Apartment"
|
||||||
|
name = ""
|
||||||
|
value = ""
|
||||||
|
placeholder = ""
|
||||||
|
type = "text"
|
||||||
|
required = false
|
||||||
|
disabled = false
|
||||||
|
readonly = false
|
||||||
|
help = ""
|
||||||
|
error = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <label class="wire-field wire-catalog-field {class}"><span class="wire-label">{label}<span data-show="required" class="wire-required"> *</span></span><input name="{name}" value="{value}" placeholder="{placeholder}" type="{type}" required="{required}" disabled="{disabled}" readonly="{readonly}" aria-invalid="{error ? 'true' : 'false'}" class="wire-input" /><span data-show="help && !error" class="wire-field-message wire-field-message--help">{help}</span><span data-show="error" role="alert" class="wire-field-message wire-field-message--error">{error}</span><slot /></label> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,11 @@
|
|||||||
|
component ApiAuthenticationNotice {
|
||||||
|
props {
|
||||||
|
label = "ApiAuthentication"
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
value = ""
|
||||||
|
variant = "default"
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <aside role="status" class="wire-alert wire-alert--{variant} wire-catalog-feedback {class}"><strong data-show="title || label">{title || label}</strong><span data-show="value" class="wire-badge wire-badge--{variant}">{value}</span><p data-show="description">{description}</p><slot /></aside> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component ApiErrorExample {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
component ApiHeaderTable {
|
||||||
|
props {
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
empty = false
|
||||||
|
emptyText = "No items available."
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <section class="wire-catalog-collection {class}"><header data-show="title || description"><h2 data-show="title">{title}</h2><p data-show="description">{description}</p></header><div data-show="!empty" role="list" class="wire-catalog-collection__items"><slot /></div><p data-show="empty" role="status" class="wire-muted">{emptyText}</p></section> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
component ApiKeyCreateDialog {
|
||||||
|
props {
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
open = false
|
||||||
|
closeLabel = "Close"
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <div data-show="open" class="wire-overlay wire-catalog-overlay {class}"><section role="dialog" aria-modal="true" aria-label="{title}" class="wire-dialog"><header><h2 data-show="title" class="wire-dialog__title">{title}</h2><p data-show="description" class="wire-dialog__description">{description}</p></header><slot /><button type="button" class="wire-btn wire-btn--ghost">{closeLabel}</button></section></div> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component ApiKeyDisplay {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
component ApiKeyInput {
|
||||||
|
props {
|
||||||
|
label = "ApiKey"
|
||||||
|
name = ""
|
||||||
|
value = ""
|
||||||
|
placeholder = ""
|
||||||
|
type = "text"
|
||||||
|
required = false
|
||||||
|
disabled = false
|
||||||
|
readonly = false
|
||||||
|
help = ""
|
||||||
|
error = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <label class="wire-field wire-catalog-field {class}"><span class="wire-label">{label}<span data-show="required" class="wire-required"> *</span></span><input name="{name}" value="{value}" placeholder="{placeholder}" type="{type}" required="{required}" disabled="{disabled}" readonly="{readonly}" aria-invalid="{error ? 'true' : 'false'}" class="wire-input" /><span data-show="help && !error" class="wire-field-message wire-field-message--help">{help}</span><span data-show="error" role="alert" class="wire-field-message wire-field-message--error">{error}</span><slot /></label> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,11 @@
|
|||||||
|
component ApiMethodBadge {
|
||||||
|
props {
|
||||||
|
label = "ApiMethod"
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
value = ""
|
||||||
|
variant = "default"
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <aside role="status" class="wire-alert wire-alert--{variant} wire-catalog-feedback {class}"><strong data-show="title || label">{title || label}</strong><span data-show="value" class="wire-badge wire-badge--{variant}">{value}</span><p data-show="description">{description}</p><slot /></aside> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
component ApiParameterTable {
|
||||||
|
props {
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
empty = false
|
||||||
|
emptyText = "No items available."
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <section class="wire-catalog-collection {class}"><header data-show="title || description"><h2 data-show="title">{title}</h2><p data-show="description">{description}</p></header><div data-show="!empty" role="list" class="wire-catalog-collection__items"><slot /></div><p data-show="empty" role="status" class="wire-muted">{emptyText}</p></section> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,11 @@
|
|||||||
|
component ApiRateLimitNotice {
|
||||||
|
props {
|
||||||
|
label = "ApiRateLimit"
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
value = ""
|
||||||
|
variant = "default"
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <aside role="status" class="wire-alert wire-alert--{variant} wire-catalog-feedback {class}"><strong data-show="title || label">{title || label}</strong><span data-show="value" class="wire-badge wire-badge--{variant}">{value}</span><p data-show="description">{description}</p><slot /></aside> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component ApiRequestExample {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component ApiResponseExample {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
component ApiSchemaTable {
|
||||||
|
props {
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
empty = false
|
||||||
|
emptyText = "No items available."
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <section class="wire-catalog-collection {class}"><header data-show="title || description"><h2 data-show="title">{title}</h2><p data-show="description">{description}</p></header><div data-show="!empty" role="list" class="wire-catalog-collection__items"><slot /></div><p data-show="empty" role="status" class="wire-muted">{emptyText}</p></section> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component ApiSchemaViewer {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,11 @@
|
|||||||
|
component ApiVersionBadge {
|
||||||
|
props {
|
||||||
|
label = "ApiVersion"
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
value = ""
|
||||||
|
variant = "default"
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <aside role="status" class="wire-alert wire-alert--{variant} wire-catalog-feedback {class}"><strong data-show="title || label">{title || label}</strong><span data-show="value" class="wire-badge wire-badge--{variant}">{value}</span><p data-show="description">{description}</p><slot /></aside> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
component AppHeader {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
align = "start"
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <section class="wire-catalog-section wire-text--{align} {class}"><header data-show="eyebrow || title || description"><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h2 data-show="title">{title}</h2><p data-show="description" class="wire-muted">{description}</p></header><slot /></section> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
component ArchitectureSection {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
align = "start"
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <section class="wire-catalog-section wire-text--{align} {class}"><header data-show="eyebrow || title || description"><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h2 data-show="title">{title}</h2><p data-show="description" class="wire-muted">{description}</p></header><slot /></section> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,11 @@
|
|||||||
|
component AreaChart {
|
||||||
|
props {
|
||||||
|
title = ""
|
||||||
|
value = ""
|
||||||
|
description = ""
|
||||||
|
summary = ""
|
||||||
|
loading = false
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <figure aria-label="{summary || title}" class="wire-card wire-catalog-visualization {class}"><figcaption><strong data-show="title">{title}</strong><span data-show="value" class="wire-metric__value">{value}</span><span data-show="description" class="wire-muted">{description}</span></figcaption><div data-show="loading" class="wire-skeleton wire-catalog-visualization__skeleton"></div><div data-show="!loading" class="wire-catalog-visualization__content"><slot /></div><p data-show="summary" class="wire-visually-hidden">{summary}</p></figure> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
component ArticleHero {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
align = "start"
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <section class="wire-catalog-section wire-text--{align} {class}"><header data-show="eyebrow || title || description"><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h2 data-show="title">{title}</h2><p data-show="description" class="wire-muted">{description}</p></header><slot /></section> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
component ArticleLayout {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
align = "start"
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <section class="wire-catalog-section wire-text--{align} {class}"><header data-show="eyebrow || title || description"><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h2 data-show="title">{title}</h2><p data-show="description" class="wire-muted">{description}</p></header><slot /></section> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,11 @@
|
|||||||
|
component ArticleNewsletterCTA {
|
||||||
|
props {
|
||||||
|
label = "Action"
|
||||||
|
href = ""
|
||||||
|
type = "button"
|
||||||
|
variant = "primary"
|
||||||
|
disabled = false
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <span class="wire-catalog-action {class}"><a data-show="href" href="{href}" class="wire-btn wire-btn--{variant}">{label}<slot /></a><button data-show="!href" type="{type}" disabled="{disabled}" class="wire-btn wire-btn--{variant}">{label}<slot /></button></span> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
component ArticlePageShell {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
align = "start"
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <section class="wire-catalog-section wire-text--{align} {class}"><header data-show="eyebrow || title || description"><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h2 data-show="title">{title}</h2><p data-show="description" class="wire-muted">{description}</p></header><slot /></section> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,11 @@
|
|||||||
|
component ArticleShareActions {
|
||||||
|
props {
|
||||||
|
label = "Action"
|
||||||
|
href = ""
|
||||||
|
type = "button"
|
||||||
|
variant = "primary"
|
||||||
|
disabled = false
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <span class="wire-catalog-action {class}"><a data-show="href" href="{href}" class="wire-btn wire-btn--{variant}">{label}<slot /></a><button data-show="!href" type="{type}" disabled="{disabled}" class="wire-btn wire-btn--{variant}">{label}<slot /></button></span> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
component AttachmentPicker {
|
||||||
|
props {
|
||||||
|
label = "Attachment"
|
||||||
|
name = ""
|
||||||
|
value = ""
|
||||||
|
placeholder = ""
|
||||||
|
type = "text"
|
||||||
|
required = false
|
||||||
|
disabled = false
|
||||||
|
readonly = false
|
||||||
|
help = ""
|
||||||
|
error = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <label class="wire-field wire-catalog-field {class}"><span class="wire-label">{label}<span data-show="required" class="wire-required"> *</span></span><input name="{name}" value="{value}" placeholder="{placeholder}" type="{type}" required="{required}" disabled="{disabled}" readonly="{readonly}" aria-invalid="{error ? 'true' : 'false'}" class="wire-input" /><span data-show="help && !error" class="wire-field-message wire-field-message--help">{help}</span><span data-show="error" role="alert" class="wire-field-message wire-field-message--error">{error}</span><slot /></label> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component AttachmentUpload {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component AudioUpload {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component AuditLogPreview {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
component AuditTable {
|
||||||
|
props {
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
empty = false
|
||||||
|
emptyText = "No items available."
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <section class="wire-catalog-collection {class}"><header data-show="title || description"><h2 data-show="title">{title}</h2><p data-show="description">{description}</p></header><div data-show="!empty" role="list" class="wire-catalog-collection__items"><slot /></div><p data-show="empty" role="status" class="wire-muted">{emptyText}</p></section> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
component AuthenticatorCodeInput {
|
||||||
|
props {
|
||||||
|
label = "AuthenticatorCode"
|
||||||
|
name = ""
|
||||||
|
value = ""
|
||||||
|
placeholder = ""
|
||||||
|
type = "text"
|
||||||
|
required = false
|
||||||
|
disabled = false
|
||||||
|
readonly = false
|
||||||
|
help = ""
|
||||||
|
error = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <label class="wire-field wire-catalog-field {class}"><span class="wire-label">{label}<span data-show="required" class="wire-required"> *</span></span><input name="{name}" value="{value}" placeholder="{placeholder}" type="{type}" required="{required}" disabled="{disabled}" readonly="{readonly}" aria-invalid="{error ? 'true' : 'false'}" class="wire-input" /><span data-show="help && !error" class="wire-field-message wire-field-message--help">{help}</span><span data-show="error" role="alert" class="wire-field-message wire-field-message--error">{error}</span><slot /></label> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component AuthorAvatar {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component AuthorCard {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component AuthorizedApplicationCard {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component AutomationExampleCard {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component AvailabilityCalendar {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
component AvatarGroup {
|
||||||
|
props {
|
||||||
|
label = "Avatar"
|
||||||
|
name = ""
|
||||||
|
value = ""
|
||||||
|
placeholder = ""
|
||||||
|
type = "text"
|
||||||
|
required = false
|
||||||
|
disabled = false
|
||||||
|
readonly = false
|
||||||
|
help = ""
|
||||||
|
error = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <label class="wire-field wire-catalog-field {class}"><span class="wire-label">{label}<span data-show="required" class="wire-required"> *</span></span><input name="{name}" value="{value}" placeholder="{placeholder}" type="{type}" required="{required}" disabled="{disabled}" readonly="{readonly}" aria-invalid="{error ? 'true' : 'false'}" class="wire-input" /><span data-show="help && !error" class="wire-field-message wire-field-message--help">{help}</span><span data-show="error" role="alert" class="wire-field-message wire-field-message--error">{error}</span><slot /></label> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component AvatarUpload {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component BankTransferDetails {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,11 @@
|
|||||||
|
component BarChart {
|
||||||
|
props {
|
||||||
|
title = ""
|
||||||
|
value = ""
|
||||||
|
description = ""
|
||||||
|
summary = ""
|
||||||
|
loading = false
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <figure aria-label="{summary || title}" class="wire-card wire-catalog-visualization {class}"><figcaption><strong data-show="title">{title}</strong><span data-show="value" class="wire-metric__value">{value}</span><span data-show="description" class="wire-muted">{description}</span></figcaption><div data-show="loading" class="wire-skeleton wire-catalog-visualization__skeleton"></div><div data-show="!loading" class="wire-catalog-visualization__content"><slot /></div><p data-show="summary" class="wire-visually-hidden">{summary}</p></figure> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component BillingAddressForm {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component BillingExample {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
component BillingPeriodToggle {
|
||||||
|
props {
|
||||||
|
label = "BillingPeriod"
|
||||||
|
name = ""
|
||||||
|
value = ""
|
||||||
|
placeholder = ""
|
||||||
|
type = "text"
|
||||||
|
required = false
|
||||||
|
disabled = false
|
||||||
|
readonly = false
|
||||||
|
help = ""
|
||||||
|
error = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <label class="wire-field wire-catalog-field {class}"><span class="wire-label">{label}<span data-show="required" class="wire-required"> *</span></span><input name="{name}" value="{value}" placeholder="{placeholder}" type="{type}" required="{required}" disabled="{disabled}" readonly="{readonly}" aria-invalid="{error ? 'true' : 'false'}" class="wire-input" /><span data-show="help && !error" class="wire-field-message wire-field-message--help">{help}</span><span data-show="error" role="alert" class="wire-field-message wire-field-message--error">{error}</span><slot /></label> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
component BlackoutDatePicker {
|
||||||
|
props {
|
||||||
|
label = "BlackoutDate"
|
||||||
|
name = ""
|
||||||
|
value = ""
|
||||||
|
placeholder = ""
|
||||||
|
type = "text"
|
||||||
|
required = false
|
||||||
|
disabled = false
|
||||||
|
readonly = false
|
||||||
|
help = ""
|
||||||
|
error = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <label class="wire-field wire-catalog-field {class}"><span class="wire-label">{label}<span data-show="required" class="wire-required"> *</span></span><input name="{name}" value="{value}" placeholder="{placeholder}" type="{type}" required="{required}" disabled="{disabled}" readonly="{readonly}" aria-invalid="{error ? 'true' : 'false'}" class="wire-input" /><span data-show="help && !error" class="wire-field-message wire-field-message--help">{help}</span><span data-show="error" role="alert" class="wire-field-message wire-field-message--error">{error}</span><slot /></label> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component BlogCard {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
component BlogGrid {
|
||||||
|
props {
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
empty = false
|
||||||
|
emptyText = "No items available."
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <section class="wire-catalog-collection {class}"><header data-show="title || description"><h2 data-show="title">{title}</h2><p data-show="description">{description}</p></header><div data-show="!empty" role="list" class="wire-catalog-collection__items"><slot /></div><p data-show="empty" role="status" class="wire-muted">{emptyText}</p></section> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
component BlogList {
|
||||||
|
props {
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
empty = false
|
||||||
|
emptyText = "No items available."
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <section class="wire-catalog-collection {class}"><header data-show="title || description"><h2 data-show="title">{title}</h2><p data-show="description">{description}</p></header><div data-show="!empty" role="list" class="wire-catalog-collection__items"><slot /></div><p data-show="empty" role="status" class="wire-muted">{emptyText}</p></section> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
component BlogSearch {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
href = ""
|
||||||
|
actionLabel = "Learn more"
|
||||||
|
image = ""
|
||||||
|
alt = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <article class="wire-card wire-catalog-card {class}"><img data-show="image" src="{image}" alt="{alt}" class="wire-catalog-card__image" /><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h3 data-show="title">{title}</h3><p data-show="description">{description}</p><slot /><a data-show="href" href="{href}" class="wire-btn wire-btn--ghost">{actionLabel}</a></article> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
component BorderRadiusPicker {
|
||||||
|
props {
|
||||||
|
label = "BorderRadius"
|
||||||
|
name = ""
|
||||||
|
value = ""
|
||||||
|
placeholder = ""
|
||||||
|
type = "text"
|
||||||
|
required = false
|
||||||
|
disabled = false
|
||||||
|
readonly = false
|
||||||
|
help = ""
|
||||||
|
error = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <label class="wire-field wire-catalog-field {class}"><span class="wire-label">{label}<span data-show="required" class="wire-required"> *</span></span><input name="{name}" value="{value}" placeholder="{placeholder}" type="{type}" required="{required}" disabled="{disabled}" readonly="{readonly}" aria-invalid="{error ? 'true' : 'false'}" class="wire-input" /><span data-show="help && !error" class="wire-field-message wire-field-message--help">{help}</span><span data-show="error" role="alert" class="wire-field-message wire-field-message--error">{error}</span><slot /></label> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
component BottomNavigation {
|
||||||
|
props {
|
||||||
|
eyebrow = ""
|
||||||
|
title = ""
|
||||||
|
description = ""
|
||||||
|
align = "start"
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <section class="wire-catalog-section wire-text--{align} {class}"><header data-show="eyebrow || title || description"><span data-show="eyebrow" class="wire-eyebrow">{eyebrow}</span><h2 data-show="title">{title}</h2><p data-show="description" class="wire-muted">{description}</p></header><slot /></section> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
component BrandColorPicker {
|
||||||
|
props {
|
||||||
|
label = "BrandColor"
|
||||||
|
name = ""
|
||||||
|
value = ""
|
||||||
|
placeholder = ""
|
||||||
|
type = "text"
|
||||||
|
required = false
|
||||||
|
disabled = false
|
||||||
|
readonly = false
|
||||||
|
help = ""
|
||||||
|
error = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <label class="wire-field wire-catalog-field {class}"><span class="wire-label">{label}<span data-show="required" class="wire-required"> *</span></span><input name="{name}" value="{value}" placeholder="{placeholder}" type="{type}" required="{required}" disabled="{disabled}" readonly="{readonly}" aria-invalid="{error ? 'true' : 'false'}" class="wire-input" /><span data-show="help && !error" class="wire-field-message wire-field-message--help">{help}</span><span data-show="error" role="alert" class="wire-field-message wire-field-message--error">{error}</span><slot /></label> }
|
||||||
|
}
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
component BrandSelector {
|
||||||
|
props {
|
||||||
|
label = "Brand"
|
||||||
|
name = ""
|
||||||
|
value = ""
|
||||||
|
placeholder = ""
|
||||||
|
type = "text"
|
||||||
|
required = false
|
||||||
|
disabled = false
|
||||||
|
readonly = false
|
||||||
|
help = ""
|
||||||
|
error = ""
|
||||||
|
class = ""
|
||||||
|
}
|
||||||
|
view { <label class="wire-field wire-catalog-field {class}"><span class="wire-label">{label}<span data-show="required" class="wire-required"> *</span></span><input name="{name}" value="{value}" placeholder="{placeholder}" type="{type}" required="{required}" disabled="{disabled}" readonly="{readonly}" aria-invalid="{error ? 'true' : 'false'}" class="wire-input" /><span data-show="help && !error" class="wire-field-message wire-field-message--help">{help}</span><span data-show="error" role="alert" class="wire-field-message wire-field-message--error">{error}</span><slot /></label> }
|
||||||
|
}
|
||||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user